Help with Redirect Issue after Refresh in Next.js App on Vercel

Hello Vercel Community,

I’m currently facing an issue with my Next.js application hosted on Vercel. I had a problem similar to the React routing 404 Not Found error, so I added a vercel.json file in the root folder. This worked, and the routing issue was resolved. However, now I’m facing a new issue where after refreshing the page, the user is automatically redirected to the home page, regardless of the route they were on.

Current Behavior:

  • After refreshing the page, the user is automatically redirected to the home page (index route).
  • The page they were on before the refresh is lost.

Expected Behavior:

  • After refreshing the page, the user should stay on the same route and the app should render the correct content for that route.

Has anyone else encountered this problem? I’d appreciate any guidance on how to fix this issue so the correct page is shown after a refresh.

Thanks in advance for your help!

this is my vercel.json file
{
“rewrites”: [
{“source”: “/(.*)”, “destination”: “/”}
]
}

Please find my project DEV/testing/staging URL .

There’s another community post with 404 debugging tips that might be helpful. Please give these solutions a try and let us know how it goes.

A human should be around soon to offer more advice. But you can also get helpful information quickly by asking v0.