Docker Compose 与 Angular、Express.js 和 Nginx - 502 响应答案

【问题标题】：Docker Compose with Angular, Express.js and Nginx - 502 responseDocker Compose 与 Angular、Express.js 和 Nginx - 502 响应
【发布时间】：2020-06-03 13:30:47
【问题描述】：

docker-compose.yml

version: "3"
services:
  mongodb:
    image: "mongo:latest"
  nginx:
    restart: always
    build:
      dockerfile: Dockerfile.dev
      context: ./nginx
    ports:
      - "5000:80"
  backend:
    build:
      dockerfile: Dockerfile.dev
      context: ./backend
    ports:
      - "3000:3000"
    volumes:
      - /app/node_modules
      - ./backend:/app
    environment:
      - MONGOHOST=cluster0-ipauv.mongodb.net
      - MONGOPORT=27017
      - MONGODATABASE=node-express
      - MONGOUSER=USER
      - MONGOPASSWORD=password
  frontend:
    build:
      dockerfile: Dockerfile.dev
      context: ./frontend
    ports:
      - "4200:4200"
    volumes:
      - /app/node_modules
      - ./frontend/:/app

nginx/default.conf

upstream frontend{
    server frontend:4200 weight=10 max_fails=3 fail_timeout=30s;
    keepalive 32;
}

upstream backend{
    server backend:3000 weight=10 max_fails=3 fail_timeout=30s; 
    keepalive 32;
}

server {
    listen 80;
    server_name  frontend;
    location / {
        proxy_pass http://frontend;
    }

    location /sockjs-node {
    proxy_pass http://frontend;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
  }

    location /api {
        rewrite /api/(.*) /$1 break;
        proxy_pass http://backend;
    }


}

nginx/Dockerfile.dev

FROM nginx
COPY ./default.conf /etc/nginx/conf.d/default.conf

我在加载 URL 时遇到的错误：http://localhost:5000

[error] 6#6: *6 connect() failed (111: Connection refused) while connecting to upstream, client: 172.19.0.1, server: frontend, request: "GET / HTTP/1.1", upstream: "http://172.19.0.2:4200/", host: "localhost:5000"

【问题讨论】：

一个建议是使用 ngnix 服务器来部署您的前端应用程序。我怀疑你的构建没有成功。
看看这个如果这对你有帮助serverfault.com/questions/317393/…
感谢您的链接，我检查了但看起来这对我不起作用。您还可以详细说明用户 Nginx 服务器部署前端应用程序吗？因为我是码头工人的新手。另外，当我运行“docker-compose up --build”时，我没有收到任何错误。
是的，我可以，一旦我创建了一个示例，我会告诉你！
嘿，通过在 angular 的 package.json 中添加“--host 0.0.0.0 --disableHostCheck true”解决了这个问题，所以现在命令是“start”：“ng serve --host 0.0 .0.0 --disableHostCheck true"

标签： angular mongodb express nginx docker-compose

【解决方案1】：

抱歉，重播晚了。我希望你找到了你的问题的答案。即：在 Angular 应用程序 package.json 中添加了 --host 0.0.0.0 --disableHostCheck true 并且用于启动应用程序的命令是 ng serve --host 0.0.0.0 --disableHostCheck true

但正如我所承诺的，我创建了一个存储库，它可以帮助您构建/设置本地开发环境。看看存储库。 https://github.com/dupinder/NgnixDockerizedDevEnv

这个例子展示了如何在 UI App 和后端应用程序之间建立通信，使用 Ngnix 反向代理策略。所以不需要遵循硬绑定地址。

【讨论】：

感谢您的帮助，因为我正在本地工作，我不想构建前端，但我肯定可以将您的概念用于暂存环境
在生产中你使用什么 UI 应用程序？ CDN？
我正在开发一个测试项目，但无论如何我都会使用 UI App