Настроить Nginx для Dockerized Angular приложения

Question

Я использую dockerized angular приложение и пытаюсь обслужить его через root Nginx docker. angular docker подается через контейнер Nginx. Вот Nginx conf для angular приложения.

user                            root;
worker_processes                auto;

error_log                       /var/log/nginx/error.log warn;

events {
    worker_connections          1024;
}

http {
    include                     /etc/nginx/mime.types;
    default_type                application/octet-stream;
    sendfile                    off;
    access_log                  off;
    keepalive_timeout           3000;
    server {
        listen                  9080;
        root                    /usr/share/nginx/html;
        index                   index.html;
        server_name             localhost;
        client_max_body_size    16m;
    }
}

Ниже приводится мой root nginx conf.

user  nginx;
worker_processes  1;

error_log  /var/log/nginx/error.log info;
pid        /var/run/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include       /etc/nginx/mime.types;
    default_type  text/html;

    server {
        listen              80 default_server;
        listen              [::]:80 default_server;

        location / {
            proxy_set_header        Host $host:$server_port;
            proxy_set_header        X-Real-IP $remote_addr;
            proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header        X-Forwarded-Proto $scheme;

            proxy_pass_header       Authorization;

            add_header Pragma       "no-cache";

            proxy_pass              http://webapp:9080/;
            proxy_read_timeout      90;
        }

        // other routes
        location /identityserver {}
    }
}

С этими конфигурациями я могу получить доступ мое angular приложение через http://ip: 9080 . Но когда я пытаюсь получить к нему доступ через основной Nginx, он загружает только страницу индекса (http://ip). Другие маршруты показывают мне 404. Например, http://ip/login обеспечивает 404, но логин можно получить прямо через http://ip: 9080 / login .

Я пропускаю какие-либо конфигурации в root Nginx?

Answer 1

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

proxy_pass              http://webapp:9080;  

Answer 2

Конфигурация Nginx для вашего Angular должна выглядеть примерно так:

server {
  ...
  location / {
    root /usr/share/nginx/html;
    try_files $uri $uri/ /index.html;
  }
  error_page 404 /index.html;
}

Здесь есть две вещи:

• Используйте try_files вместо index
• Для 404, перенаправить на страницу index.html, чтобы Angular мог обрабатывать маршрутизацию.

Answer 3

вам нужно установить error_page 404 по умолчанию angular папка проекта

server {

    listen 80;
    root /etc/nginx/www/dist;

    error_page 404 /;
....
}