在nginx上运行的角度app的nginx反向代理

问题描述 投票:1回答:1

我有一个docker容器,用于在名为“website”的nginx上工作的角度应用程序。我想从名为“test.nginx”的其他nginx反向代理容器到达此容器。但我不知道如何为反向代理配置nginx.conf。

首先,我正在为角应用创建docker镜像。 Dockerfile:

FROM nginx:alpine
COPY default.conf /etc/nginx/conf.d/default.conf
COPY angular /usr/share/nginx/html

这里的angular文件夹包含angular build file(index.html,main.js,runtime.js ......)

default.conf:

server {
    listen       80;
    server_name  localhost;

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

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

泊坞窗,compose.yml

version: '3.4'

services:

  nginx:
    image: nginx:latest
    container_name: test.nginx
    volumes:
      - ./nginx.conf:/etc/nginx/nginx.conf
    ports:
      - 2020:80
    environment:
      - NETWORK_ACCESS=internal

  website:
    image: website
    container_name: website
    restart: on-failure       
    ports:
      - 2121:80

和test.nginx容器使用这个nginx.conf

worker_processes 1;
events { worker_connections 1024; }

http {
    server {
        location /client/ {
            proxy_pass         http://website/;
            proxy_redirect     off;
            proxy_set_header   Host $host;
            proxy_set_header   X-Real-IP $remote_addr;
            proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header   X-Forwarded-Host $server_name;
        }    
    }

}

当我尝试使用qazxsw poi达到角度应用时,一切都很棒。但如果我尝试这个qazxsw poi我得到这些错误

http://localhost:2121

当我只使用index.html文件而不是角度构建文件时,我可以从http://localhost:2020/client/website | 192.168.208.2 - - [30/Apr/2019:15:11:18 +0000] "GET / HTTP/1.0" 304 0 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" "192.168.208.1" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /client/ HTTP/1.1" 304 0 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 2019/04/30 15:11:18 [error] 6#6: *5 open() "/etc/nginx/html/runtime.js" failed (2: No such file or directory), client: 192.168.208.1, server: , request: "GET /runtime.js HTTP/1.1", host: "localhost:2020", referrer: "http://localhost:2020/client/" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /runtime.js HTTP/1.1" 404 556 "http://localhost:2020/client/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 2019/04/30 15:11:18 [error] 6#6: *3 open() "/etc/nginx/html/polyfills.js" failed (2: No such file or directory), client: 192.168.208.1, server: , request: "GET /polyfills.js HTTP/1.1", host: "localhost:2020", referrer: "http://localhost:2020/client/" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /polyfills.js HTTP/1.1" 404 556 "http://localhost:2020/client/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 2019/04/30 15:11:18 [error] 6#6: *4 open() "/etc/nginx/html/styles.js" failed (2: No such file or directory), client: 192.168.208.1, server: , request: "GET /styles.js HTTP/1.1", host: "localhost:2020", referrer: "http://localhost:2020/client/" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /styles.js HTTP/1.1" 404 556 "http://localhost:2020/client/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 2019/04/30 15:11:18 [error] 6#6: *1 open() "/etc/nginx/html/vendor.js" failed (2: No such file or directory), client: 192.168.208.1, server: , request: "GET /vendor.js HTTP/1.1", host: "localhost:2020", referrer: "http://localhost:2020/client/" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /vendor.js HTTP/1.1" 404 556 "http://localhost:2020/client/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 192.168.208.1 - - [30/Apr/2019:15:11:18 +0000] "GET /main.js HTTP/1.1" 404 556 "http://localhost:2020/client/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36" test.nginx | 2019/04/30 15:11:18 [error] 6#6: *6 open() "/etc/nginx/html/main.js" failed (2: No such file or directory), client: 192.168.208.1, server: , request: "GET /main.js HTTP/1.1", host: "localhost:2020", referrer: "http://localhost:2020/client/" 到达index.html文件

有人可以帮帮我吗?谢谢 :)

***编辑:

我想我得到了这个错误,因为angular是一个单页应用程序。现在的问题是如何为spa配置location和proxy_pass?

angular docker nginx reverse-proxy
1个回答
1
投票

你不能只用NGINX和Angular来做反向代理。

我们必须做的是将haproxy(http://localhost:2020/client/)添加为单独的服务并配置它以便它可以查看nginx服务器。

这个码头图像可能是一个好的开始(http://localhost:2121

对于我们的nginx配置,它看起来类似于:

http://www.haproxy.org/

然后,在我们的HA代理中(使用HTTPS)。我添加了一些评论来帮助指导您完成此操作。

https://hub.docker.com/_/haproxy

然后,当您完成配置HA代理并指向您的nginx服务器后,请确保您的用户首先使用其FQDN的IP地址转到haproxy。然后,HA代理将处理为您的反向代理。

关于你关于SPA的问题,我的理解是在你添加的NGINX配置中:

        # Api Endpoint
        location /api/{
        proxy_pass https://api.company.com:1234/;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
        }
© www.soinside.com 2019 - 2024. All rights reserved.