Getting 404 with react router app with nginx [dupl

Question

This question already has an answer here:

• React Router BrowserRouter leads to “404 Not Found - nginx ” error when going to subpage directly without through a home-page click 4 answers

I have a react frontend app that uses react-router to create different routes. On development server its working fine but when I build the project it gives me 404 while accessing it with different routes directly. Website perfectly opens with xyz.net. And it gives 404 when I try to access it with xyz.net/login.

Here is my nginx conf

server {

listen 80;
server_name  xyz.net www.xyz.net;
root /root/frontend/react/build/;
index index.html;


location /api/ {

    include proxy_params;
    proxy_pass http://localhost:8000/;
}

}

Answer 1

This worked for me when I ran into this issue:

location / {
                #...
                try_files $uri $uri/ /index.html$is_args$args;
                #...  
      }

However, I've encountered errors in other projects using *.ejs templates for development builds, and *.html plugins for production builds with webpack. The answer to which I found here:

React-router issue when refreshing URLs with SSL Enabled

Hope that helps.