Fix Angular 404 on reload Nginx

To keep it short, here is the code you need to replace in /etc/nginx/conf.d/default.conf

server {
    listen       80;
    server_name  localhost;

    root   /usr/share/nginx/html;
    index  index.html index.htm;

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

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

}

You may want to update server_name to your domain name if you are not deploying in docker. Otherwise, this config works with docker.

Give it a try, you’ll see that the 404 page is gone when you refresh your site.

Leave a Comment