NGINX and Angular 2

Question

My current app users routes like this /myapp/, /myapp//, /myaapp/dept/

My app is currently deployed in an internal http server with NGINX. The other server that accepts external traffic, also runs NGINX and forwards it to the internal server.

I have add baseref=/myapp to the index.html as per documentation

If the user goes to http://www.myexternalserver.com/myapp, the app works perfectly. If the user is inside the page and clicks on an internal link like http://www.myexternalserver.com/myapp/myparameter, it works. The url in the browser changes, the page is displayed as intended. I am guessing it's processed by Angular 2.

Unfortunately when a user types in the url directly: http://www.myexternalserver.com/myapp/myparameter, I get a 404 error made by NGINX.

I think I have to configure NGINX settings but I don't know how should modify NGINX's config or what to put in the sites-available/default file/

Answer 1

I just had this same issue and found a solution. My base href is "/", however.

Below is my nginx.conf:

worker_processes  1;  events {     worker_connections  1024; }  http {     include       mime.types;     default_type  application/octet-stream;     sendfile        on;     keepalive_timeout  65;      server {         listen       80;         server_name  mysite.com www.mysite.com;         root /usr/share/nginx/html;          location / {             try_files $uri$args $uri$args/ /index.html;         }     } }