Okay so here’s the issue: Whenever I attempt to access part of my React application via URL (ex: accessing the “about” page of my website by typing “thebamfblog.com/about” in the URL) I get the following error.
This is very problematic as the social media sharing buttons that users click on utilizes a link to the post they want to share–but because of this routing issue–whatever they share will direct them to this error page instead of the expected article.
Navigating to the link via the react-dom-router buttons within the application causes no issues.
I am using react-router-dom and have little experience with netlify, but am learning fast!
Thanks for the feedback. First thing’s first, have you managed to build this locally with success? Have you tried putting the _redirects file in your public folder?
Using yarn build > yarn global add serve > serve -s build, I can successfully navigate the React application by directly typing the IP address and /about in the URL (x.x.x.x:5000/about).
There is currently a copy of _redirects in the public folder as well as top directory of the repo.
Any ideas on how to handle this redirection challenge?
Hi, @jaylowe1, I’m not seeing any redirect processed by the most recently published deploy here:
Quoting:
No redirect rules processed
This deploy did not include any redirect rules.
This is a public repo so I tested the git clone, yarn install, and yarn build for this repo. When I did this it created the file in the build directory as _redirects.txt not _redirects.
I don’t know why the build does this but that is the reason the redirect isn’t being processed.
Do you know how to get the build to keep the filename unchanged when building? If so, that is the solution and the redirect will work as expected once this is done.
I appreciate your through response! Things have been crazy for me so I’m just now getting some time to problem solve.
Using the issue that you pointed out, I successful resolved the problem using two strategies:
I accessed the /public folder via GitHub, deleted the file, and manually added a new _redirects file with the same information.
I added the following after the “build” script within package.json – "react-scripts build && echo '/* /index.html 200' | cat >build/_redirects ". This insured that future builds did not receive a .txt format _redirects file.
Thanks so much to the Netlify support and build teams! You guys rock and your product is awesome. Keep it up
I’ve got that kind of problem too, I’ve been using react-router-dom and on localhost links worked fine, until I’ve pushed my repo to github and deployed it to netlify, what I did was just adding a _redirect file inside public/ folder and put /* /index.html 200 inside of that file, and voilà my links a now working on Netlify.
I’ve created a community account just to thank you.
Love the Netlify product <3
I think I have a similar issue, though adding the _redirects file within the public directory has not solved it.
Whenever I try and route to a page through a direct (nested) URL , such as ‘https://jvcparry.com/products/indie’, it fails to load a page and gives the error
However when I navigate the deployed version through links, everything loads fine. I also don’t get this error when I’m running the app locally, which I guess means it must be something to do with deployment?
I’ve trawled through all the other posts I can find with this error, and also things to do with Netlify/CRA deployments.
