How to fix 404 error when reloading application with react-router?

Question

Nginx

There is a react app based on create-react-app, with react-router (Browser routing).
I raise the application locally using nginx.
For example, I follow links to localhost/page/group
The application and routing work correctly.
But if, for example, to refresh the page, then a 404 error is given.
nginx config

server {
        listen			80;
        server_name	        app.ru;
    rewrite ^/spa/(.*) /$1 permanent;
    root			build;
    index  index.html;

    location / {
            try_files $uri /$uri /index.html;
        }
    }

How to configure correctly so that pages are displayed correctly when the page is refreshed?

Answer 1

You need to return index.html from all routes except those that end in .css/.js for example.

server {
  ...

  location / {
    alias /static/folder;
    try_files /index.html /index.html;
  }

  location /assets {
    alias /static/folder/assets;
  }

  location ~ .+\.(css|js) {
    alias /static/folder;
  }
}

Something like this