404 Error when deploying on vercel

[PatelN123]

Hi,

I encounter the 404 error when I deploy this to vercel.
Here is the repo: https://github.com/PatelN123/prod/tree/main/platforms

Thanks

[danieldev046]

@PatelN123 Did you find a solution for this?

[PatelN123]

@PatelN123 Did you find a solution for this?

No, I didn't. :(

[jonoise]

Most likely this is a problem with your _middleware file, guys. I was having this same issue and editing the _middleware fixed it. Basically when getting the currentHost and when comparing hostnames against your domains. You need to be 100% that you setting this information correctly in relation with your domain settings in your vercel dashboard.

PD: I bought a xyz domain to test the app. I guess that helped too.

[drewes]

@soloamilkar would you mind elaborating a bit more? I can't seem to be able to resolve the issue. What did refer to with domain settings on the Vercel dashboard?

[steven-tey]

@PatelN123 @danieldev046 Echoing what @soloamilkar said, this is probably due to an incorrect configuration of your custom domain.

You can also use wildcard subdomains on .vercel.app links that are associated with your Vercel team slug.

In the case of the demo, our team slug is platformize, thus *.platformize.vercel.app works. Do note that you'll still need to add *.platformize.vercel.app as a wildcard domain on your Vercel dashboard.

I updated the comment here to make things clearer.

I will be closing this issue for now but happy to reopen if there are any other confusions around this!

[OlehObodin]

Have similar problem
Issue: #132

[avatarangg]

same problem with me

[eliagoris]

I had the same error.

The solution is to NOT skip the domain configuration on this guide

To explain further, I'll write the steps that solved for me:

1. Add your custom domain to your Vercel project domains settings:

• Add both your base domain (yourdomain.com) and also wildcard domain (*.yourdomain.com)
  As I have seen, .vercel.app domains don't work with wildcard, so you SHOULD use a custom domain instead of .vercel.app

2. Add your domain to the middleware.ts file:

• Add .yourdomain.com to this line (replace .vercel.pub with your domain)
• Add yourdomain.com to this line (replace platformize.vercel.app with your domain)

[steven-tey]

Hey ya'll, following up on this – @PatelN123 @danieldev046 @drewes @avatarangg can y'all share a bit more on the issue you're facing?

FYI I updated the comment here to make things clearer.

The best approach is to use your own domain instead of a .vercel.app subdomain right from the get-go to make things easier, but if you want to use a .vercel.app subdomain anyway, you'll have to make sure that the subdomain that you're using is identical to your Vercel team slug.

[Gaccoo]

For all of you who come and want to route your root domain to a folder add www. prefix to the host.

 if (hostname === "www.your-domain.com" || hostname === "localhost:3000") {
    url.pathname = `/home${url.pathname}`;
    return NextResponse.rewrite(url);
  }

[Thebro57]

I’m having this same problem. I’m trying to test out Vercel and its GitHub capabilities by using https://github.com/Thebro57/Ultraviolet for a repository, since I don’t currently develop on GitHub. It keeps coming up as a 404, and I currently am broke (XD) and don’t want to spend money on a domain. Help, please?

[shahadadrohid]

I got cannot get / route error in express deploy. what can i do now?

[tutnyal]

I had the same error.

The solution is to NOT skip the domain configuration on this guide

To explain further, I'll write the steps that solved for me:

1. Add your custom domain to your Vercel project domains settings:

• Add both your base domain (yourdomain.com) and also wildcard domain (*.yourdomain.com)
  As I have seen, .vercel.app domains don't work with wildcard, so you SHOULD use a custom domain instead of .vercel.app

2. Add your domain to the middleware.ts file:

• Add .yourdomain.com to this line (replace .vercel.pub with your domain)
• Add yourdomain.com to this line (replace platformize.vercel.app with your domain)

This was very helpful. Thanks!

also, for those still facing the issue, do the above. Here is how I fixed mine.

My hostname or NEXT_PUBLIC_ROOT_DOMAIN is "ainime.me"

1. In vercel, don't forget to change the NEXT_PUBLIC_ROOT_DOMAIN under settings/environment variables.
   

2. In your middleware.ts file, bc I added the wildcard domain(*.ainime.me" I made sure to add the "www" to my domain name. the "Get hostname of request" part of the code will change your host name to ".ainime.me" instead of "ainime.me" This will make the middleware think this is a page URL in your app/platform, but it doesn't exist so it returns a 404page not found. see what I did below.
   if ( hostname === "www.ainime.me" || "ainime.me" || hostname === process.env.NEXT_PUBLIC_ROOT_DOMAIN ) { return NextResponse.rewrite( new URL(/home${path === "/" ? "" : path}, req.url), ); }

3. now with this middleware.ts file change, in vercel under your project domain settings, make sure to forward the domain without the "www." in front(ainime.me), to the one with it(www.ainime.me). See mine below
   

I hope this helps, I spent 2 days on it.