How to configure NGINX to deploy various Single Pages applications (SPA ...... static files) depending on location (under the same server name) with routines

Question

My goal is to configure two different single-page applications (SPA) in the same domain where we show the SPA corresponding to the requested location / path. I also want one of the two SPA on / location to be selected by default. And .. I want the html5 location paths added by the SPA to actually go to the right place if someone enters the URL in the browser.

Easier to explain by example.

Example:

The user goes to mydomain.com/app and the server serves the contents in / home / user / app / dist (which has index.html and all js / css assets) (using linux so / home / user is just my way to home directories).

The user goes to mydomain.com/auth and the server serves the contents in / home / user / auth / dist

User navigators in / and the server serves the contents in / home / user / auth / dist (/ navs for authorization by default)

User navigators for mydomain.com/auth/login and the server, again, maintains the contents in the folder / home / user / auth / dist but the url remains mydomain.com/auth/login, so auth SPA can use it as a route

User navigators for mydomain.com/auth/signup and the server, again, serves the contents in the folder / home / user / auth / dist again, the url remains mydomain.com/auth/login so that auth SPA can use it as a route

user navigators for mydomain.com/app/home and the server serves the content in / home / user / app / dist

root/alias/rewrite/regex/=/^ ~. nginx, , :

server {
listen [::]:80 default_server;
listen 80;
server_name mydomain.com 127.0.0.1;    # Make it serve in mydomain.com

# ^~ rules stop matching after the exact match 
location ^~ /app {                     # if location start matches /app
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}                                      # if location start matches app/lobby
location ^~ /app/home {
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

# you can see that I need to add a new one per each client js app route
location ^~ /app/home/visitor {
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

location ^~ /auth/login {
  alias /home/user/auth/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}
location ^~ /auth {
  alias /home/user/auth/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

# Rewrites / to auth, appending whatever params to path
#   var (for the client to consume)for now
location / {
  rewrite ^/(.*) /auth?path=$1 last;
}

}

}

index.html /dist

, , js- , ( ). , location ~ ~ , - . expresion =..., 404, 403 500 nginx.

, / root, /app /auth dist, (, /home/user/auth/dist/auth ).

, , SPA, basedir = "app" ( one) basedir = "auth" auth one.

, , , .

? . .

P.s. Ember Ember-cli, - . dist/ , , http://www.mydomain/app/home/visitor/comments/new, ( , !).

, 404 /app /auth:

server {
listen [::]:80 default_server;
listen 80;
server_name localhost mydomain.com 127.0.0.1;

index index.html;

location /app {
  root /home/user/app/dist;
  try_files $uri $uri/index.html index.html;
}

location /auth {
  root /home/user/auth/dist;
  try_files $uri $uri/index.html index.html;
}

}

Answer 1

, , default sites-enabled, .

EDIT:

server {
  listen [::]:80 default_server;
  listen 80;
  server_name localhost mydomain 127.0.0.1;

  location /app {
    alias /home/user/app/dist/;
    index index.html;
    try_files $uri $uri/ index.html =404;
  }

  location /auth {
    alias /home/user/auth/dist/;
    index index.html;
    try_files $uri $uri/ index.html =404;
  }

  location / {
    rewrite ^/(.*) /auth?$1 last;
  }
}

nginx docs, .