NGINX, proxy_pass and SPA routing in HTML5 mode

Viewed 6595

I have NGINX set up as a reverse proxy for a virtual network of docker containers running itself as a container. One of these containers serves an Angular 4 based SPA with client-side routing in HTML5 mode.

The application is mapped to location / on NGINX, so that http://server/ brings you to the SPA home screen.

server {
    listen 80;

    ...

    location / {
        proxy_pass http://spa-server/;
    }

    location /other/ {
        proxy_pass http://other/;
    }

    ...
}

The Angular router changes the URL to http://server/home or other routes when navigating within the SPA.

However, when I try to access these URLs directly, a 404 is returned. This error originates from the spa-server, because it obviously does not have any content for these routes.

The examples I found for configuring NGINX to support this scenario always assume that the SPA's static content is served directly from NGINX and thus try_files is a viable option.

How is it possible to forward any unknown URLs to the SPA so that it can handle them itself?

1 Answers
Related