Angular 角度路由在nginx docker容器中不起作用

Angular 角度路由在nginx docker容器中不起作用,angular,docker,nginx,Angular,Docker,Nginx,我们有一个角度的应用程序,我们正试图在docker nginx:alpine中运行 到目前为止,一切都在100%工作,包括从80重定向的ssl,但我们无法让角度路由工作。如果我们直接去某个地方,它会一直转到404 server { listen 80; server_name *.localhost; return 301 https://$host$request_uri; } server { listen 443 ssl http2; listen [::]:

我们有一个角度的应用程序,我们正试图在docker nginx:alpine中运行 到目前为止,一切都在100%工作,包括从80重定向的ssl,但我们无法让角度路由工作。如果我们直接去某个地方,它会一直转到404

server {
  listen 80;
  server_name *.localhost;
  return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    server_name *.localhost;
    root  /usr/share/nginx/html;

    ssl_certificate /etc/nginx/ssl.pem;
    ssl_certificate_key /etc/nginx/ssl.key;
    ssl_session_timeout 1d;
    ssl_session_cache shared:SSL:50m;
    ssl_session_tickets off;

    # intermediate configuration. tweak to your needs.
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers 'ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA:ECDHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES256-SHA:ECDHE-ECDSA-DES-CBC3-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:DES-CBC3-SHA:!DSS';
    ssl_prefer_server_ciphers on;

    # HSTS (ngx_http_headers_module is required) (15768000 seconds = 6 months)
    add_header Strict-Transport-Security 'max-age=31536000; includeSubDomains';

    # OCSP Stapling ---
    # fetch OCSP records from URL in ssl_certificate and cache them
    ssl_stapling on;
    ssl_stapling_verify on;

    resolver 8.8.8.8;

    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

    location / {
        root /usr/share/nginx/html;
        index index.html index.htm;

        add_header 'Access-Control-Allow-Origin' $http_origin;
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';

        try_files $uri $uri/ /index.html;

        if ($request_method = 'OPTIONS') {
           add_header 'Access-Control-Allow-Origin' $http_origin;
           add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';

           # Custom headers and headers various browsers *should* be OK with but aren't

           add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';

           # Tell client that this pre-flight info is valid for 20 days

           add_header 'Access-Control-Max-Age' 1728000;
           add_header 'Content-Type' 'text/plain; charset=utf-8';
           add_header 'Content-Length' 0;
           return 204;
        }

        if ($request_method = 'POST') {
           add_header 'Access-Control-Allow-Origin' $http_origin;
           add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
           add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
           add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
        }

        if ($request_method = 'GET') {
           add_header 'Access-Control-Allow-Origin' $http_origin;
           add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
           add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
           add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
        }
    }
}
要让一切正常工作是一件很困难的事情,因为我从来没有从头开始构建过nginx映像,尤其是没有使用ssl

编辑: 经过多次尝试。如果我加上

location /login {
    try_files /index.html =404;
}
然后在登录页面,我可以刷新它,它的工作。 无论如何,这让我相信位置/不是万能的。我真的不想为每条路线添加位置,因为该应用程序在“位置/更改”下有几千个位置


你的容器需要支持单页应用重定向,请检查这个例子:或者我尝试了他们的方式,他们的图像它不工作我也没有尝试这两个图像,只是给了你一个方向。。。通常,在角度路由的情况下,NGINX需要理解这不是NGINX定义的路由,并将其重定向回index.html。我个人使用自定义节点JS服务器提供静态角度文件。也请检查此项:
try_files $uri $uri/ /index.html;
try_files $uri /index.html;