nginx 2 местоположения для разных приложений (реагируют и angular) - PullRequest
Новая
       41

nginx 2 местоположения для разных приложений (реагируют и angular)

0 голосов
/ 30 января 2020

У меня есть приложение React и панель администратора, встроенная в Angular:

/ var / www/example.com/example/web <- React </p>

/ var / www/example.com/example/admin <- Angular</p>

Это моя Nginx конфигурация: 

server {

   server_name example.com;
   index index.html index.htm;

   # React
   location / {
        root /var/www/example.com/example/web/build;
        try_files $uri $uri/ /index.html;
   }

   # Admin
   location /admin {
        root /var/www/example.com/example/admin/dist;
        try_files $uri $uri/ /index.html;
   }
}

Когда я перехожу на example.com/admin перенаправляет меня в приложение реагирования вместо angular.

Я знаю, что раньше об этом часто спрашивали, но я пытался исправить это весь день без удачи: (

1 Ответ

2 голосов
/ 30 января 2020

Это происходит потому, что последний аргумент директивы try_files должен быть URI или кодом ошибки HTTP. В вашем случае при обработке запроса http://example.com/admin результирующий URI второй директивы try_files будет равен /index.html, который в следующий ход будет обработан с первым блоком местоположения и приведет вас к реакции приложения.

Одно из решений состоит в том, чтобы поместить приложение angular в папку admin папки приложения реакции: 

server {

   server_name example.com;
   index index.html index.htm;
   # React folder
   root /var/www/example.com/example/web/build;

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

   # Admin
   location /admin {
        # angular app must be in the /var/www/example.com/example/web/build/admin folder
        try_files $uri $uri/ /admin/index.html;
   }
}

Таким образом, в результате URI второй директивы try_files будет /admin/index.html, что приведет вас в angular файл индекса приложения.

Второе решение заключается в использовании директивы alias для второго блока местоположения: 

server {

   server_name example.com;
   index index.html index.htm;

   # React
   location / {
        root /var/www/example.com/example/web/build;
        try_files $uri $uri/ /index.html;
   }

   # Admin
   location /admin {
        alias /var/www/example.com/example/admin/dist;
        try_files $uri $uri/ /admin/index.html;
   }
}

Обратите внимание, что в результате URI запроса http://example.com/admin будет /admin/index.html, который все еще будет обрабатываться вторым блоком местоположения и обрабатываться с файлом /var/www/example.com/example/admin/dist/index.html (если я использую директиву root вместо alias one, префикс местоположения /admin будет добавлен к пути, и индексный файл будет найден в папке /var/www/example.com/example/admin/dist/admin.

В обоих случаях отсутствие индексного файла приложения angular в папке, в которой будет искать nginx Это будет причиной ошибки nginx HTTP 500 из-за бесконечного перенаправления на /admin/index.html URI.

...