404 Not Found error on nginx Angular: 8.0.2 routing 404 Not Found error on nginx Angular: 8.0.2 routing nginx nginx

404 Not Found error on nginx Angular: 8.0.2 routing


I hope you know exactly what the problem is. This problem occurs in SPA (Single Page Applications). The url you type looks for the page directory/file wise. If you go to lets say mywebsiteurl/radar-input it will look for file radar-input. In SPA's there's only one file and thats index.html so it won't find the radar-input file and throw a 404.

SPA's have all their logic, routing in the index.html and once it gets served it handles everything for you (not case for non-spas), so if you go to mywebsiteurl/ it will just work fine and all urls will be loaded through app routing reason being that mywebsiteurl/ will look for index.html file and find it and serve that. So if your website is working fine by visiting the base url means that your static files are in the correct directory you just need to add this to you nginx.conf

location / {try_files  $uri /index.html;        #check if uri exists else serve index.html as rewrite}

which basically tries to first find the file in url , if it doesn't exist it will serve the index.html.


You can try enabling the hashtag in the angular router. It comes to help when a webserver is configured wrong, so the routing will be done client side. At least you will know where to search the issue for.

RouterModule.forRoot(routes, {useHash: true})

IF the routing is still wrong with the hashtags, it means the issue is in the router configuration, if it works, than the nginx config is bad.


You could try replacing the location block in your Nginx configuration with the code below:

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

You can remove any other location blocks you have configured. Just adding this one should do it. It redirects all the requests to index.html