Как настроить NGINX для развертывания различных одностраничных приложений (SPA... i.e статические файлы) в зависимости от местоположения (под тем же именем сервера) с подпрограммами

моя цель-настроить два разных одностраничных приложения (SPA) в одном домене, где мы показываем SPA, соответствующий запрошенному местоположению / пути. Я также хочу по умолчанию использовать один из двух спа-центров on / location. И.. Я хочу, чтобы пути расположения истории html5, добавленные SPA, фактически направлялись в нужное место, если кто-то вводит url-адрес в браузере.

это проще объяснить на примере.

пример:

навигация пользователя к mydomain.com/app и сервер обслуживает содержимое под /home / user/app / dist (который имеет индекс.html и все активы js / css) (использование linux so /home/user-это только мой путь к домашнему каталогу).

навигация пользователя к mydomain.com/auth и сервер обслуживает содержимое под /home/user/auth / dist

навигация пользователя к / и сервер обслуживает содержимое под /home / user/auth / dist (/navs для auth по умолчанию)

навигация пользователя к mydomain.com/auth/login и сервер, опять же, служит содержимое в папке/home/user/auth / dist но url остается mydomain.com/auth/login так что auth SPA можно использовать в качестве маршрута

навигация пользователя к mydomain.com/auth/signup и сервер, опять же, обслуживает содержимое в папке /home/user/auth/dist опять же, url остается mydomain.com/auth/login так что auth SPA можно использовать в качестве маршрута

навигация пользователя к mydomain.com/app/home и сервер обслуживает содержимое под /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= last;
}

}

}

Он должен найти индекс.html в папке / dist

Я хотел бы использовать либо регулярные выражения, либо соответствие местоположения, которое позволяет остальной части совпадения для клиентского приложения js поймать, так что мне не нужно добавлять новое правило для каждого маршрута(это приложение фактически имеет вложенные маршруты состояния). Я знаю, что модификатор location ^~ останавливается после соответствия определенному правилу, но я не смог заставить его работать по-другому. Если я не использую модификатор, или регулярное совпадение местоположения экспрессии, или модификатор=... Я просто получаю 404, 403 и 500 ответов от nginx.

кроме того, если я перестану использовать псевдоним / переписывать и перейду с ключевым словом root, он попытается найти /app или / auth фактические папки в папке dist, чего он действительно не должен (например, если/home/user/auth/dist / auth папка просуществовавший.)

у меня также есть клиент, который знает, что такое базовый каталог для каждого СПА, например basedir = "app"(для app one) и basedir=" auth " для auth one.

Я думаю, что я делаю переписывание неправильно, или мне нужно больше переписывать, или дополнительные правила, чтобы сделать вещи более общими.

Как мне это сделать? Была бы признательна некоторая примерная конфигурация. Спасибо.

P. s. Я использую Ember с Ember-cli, если кому-то интересно. Этот создает папку dist / со встроенным приложением, а также может разрешать такие маршруты, как http://www.mydomain / app / главная / посетитель / комментарии / 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;
}

}

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? last;
  }
}

Это также стоит проверить этот вопрос и nginx docs которые объясняют немного больше различий между root и alias.