reactjs - Dockerize React-Django App 并在 Nginx 服务器上服务错误：502 Bad Gateway

Question

我有四个容器，我试图在 Nginx 服务器上为客户端提供服务，但我得到了502 Bad Gateway. 我认为那是因为我的地址端口错误，但据我所知，我有正确的端口转发。我很感激这里的任何帮助，如何解决它。谢谢

码头工人-compose.yml

version: "3.7"

services:
  backend:
    container_name: backend
    build: ./backend
    command: >
      sh -c "python backend/manage.py makemigrations
      && python backend/manage.py runserver 0.0.0.0:8000"
    volumes:
      - ./backend:/app/backend
    environment:
      - "DATABASE_URL=postgres://postgres:postgres@db:5432/postgres"
    expose:
      - 8000
    stdin_open: true
    tty: true
    depends_on:
      - db
  
  db:
    container_name: db
    build: ./db
    ports:
      - 5432:5432
    volumes:
      - postgres_data:/var/lib/postgresql/data/
    environment:
      - "POSTGRES_HOST_AUTH_METHOD=trust"

  frontend:
    container_name: client
    build: ./client
    volumes:
      - ./client:/app/client
      - /app/client/node_modules
    expose:
      - 3000
    stdin_open: true
    tty: true
    environment:
      - NODE_ENV=development
    depends_on:
      - backend

  nginx:
    container_name: webserver
    build: ./webserver
    links:
      - frontend
      - backend
    depends_on:
      - frontend
      - backend
    ports:
      - "8080:80"
    

volumes:
  postgres_data:

Nginx - Dockerfile

FROM nginx

RUN rm /etc/nginx/conf.d/default.conf

COPY nginx-proxy.conf /etc/nginx/conf.d 

nginx-proxy.conf

server {
    listen          80;
    server_name     localhost;

    location / {
        proxy_pass  http://client:3000;
    }

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

结果

标签： reactjsdockernginxnginx-reverse-proxynginx-config

Answer 1

它应该是服务的名称；前端，而不是 container_name 客户端

proxy_pass http://frontend:3000;