Redirects/Navigate are not working

Hey guys, I uploaded a static website (React.js) and when I try to navigate through my routes they are not working.

Here is my website: https://marcatexto.onrender.com/

When I try to type this route in the URL https://marcatexto.onrender.com/home it’s showing 404 not Found. If I try other routes are not working too, but if I run my project localy is working fine. When I navigate through buttons/interactions on my website the routes are working in render, but if try to change the route in the URL is not working.

I already tried everything with Redirects/Rewrites and Headers too, but it’s not working. The project region that I didn’t choose, it’s saying Global. Can someone help me, pls?

1 Like

Hi there,
Can you share the redirect/rewrite you’ve tried here?

John B

Sure! I already tried this:

And I tried to change for Rewrite too with the same data.

@John_B do you have any idea how to solve this issue?

So when a React app is deployed away from ‘localhost’ it will behave very differently. This isn’t a Render issue, it’s a routing issue.

You’re right in that when you click around the app it would work - this is all ‘faked’ by the framework and the address bar updates client side as no actual roundtrips are being made to the server.

When you deep link to one of your routes like /home from a link or directly in the address bar then you need to have this request routed into your sites /index.html - what you’ll do is rewrite /* into /index.html

For React, we cover this in our documentation at:

https://render.com/docs/deploy-create-react-app#using-client-side-routing

John B

2 Likes

Now it’s working perfectly! Thank you so much!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.