Сконфигурируйте Nginx для React и Flask с Docker -Compose

Question

Я пытаюсь настроить несколько Docker контейнеров для веб-сайта с Nginx.

У меня docker -компонентная работа по раскрутке каждого контейнера, но у меня возникают проблемы с получением приложением React для подключения к серверу Gunicorn WSGI для API Flask при использовании Nginx.

Есть идеи, почему это может произойти? Работает нормально без Nginx на картинке. Нужно ли мне Nginx conf для приложения flask? Или это случай маршрутизации запросов к серверу Gunicorn WSGI от Nginx?

Реагирующий интерфейс (контейнер)

# build environment
FROM node:12.2.0-alpine as build
WORKDIR /usr/src/app
ENV PATH /usr/src/app/node_modules/.bin:$PATH
COPY package.json /usr/src/app/package.json
RUN npm install --silent
RUN npm install react-scripts@3.0.1 -g --silent
COPY . /usr/src/app
RUN npm run build

# production environment
FROM nginx:1.16.0-alpine
COPY --from=build /usr/src/app/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Nginx .conf

server {

  listen 80;

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

  error_page   500 502 503 504  /50x.html;

  location = /50x.html {
    root   /usr/share/nginx/html;
  }

}

Docker -композит

version: '3.7'

services:
  middleware:
  build: 
      context: ./middleware
      dockerfile: Dockerfile.prod
  command: gunicorn --bind 0.0.0.0:5000 main:app
  ports:
    - 5000:5000
  env_file:
    - ./.env.prod
frontend:
  container_name: frontend
  build:
    context: ./frontend/app
    dockerfile: Dockerfile.prod
  ports:
  - '80:80'

Answer 1

Да, вам нужно передать трафик c в Nginx в приложение WSGI, что-то вроде

server {
    listen 80;
    server_name your_domain www.your_domain;

    location / {
        include uwsgi_params;
        uwsgi_pass unix:/home/sammy/myproject/myproject.sock;
    }
}

подробнее здесь

Обновление

В этом конкретном случае вам потребуется прокси-сервер к Gunicorn, который находится в отдельном контейнере, видимом под именем middleware.

Из-за этого директива uwsgi_pass должна ссылаться на этот контейнер:

server {
    listen 80;
    server_name your_domain www.your_domain;

    location / {
        include uwsgi_params;
        uwsgi_pass http://middleware:5000;
    }
}

Обратите внимание, что если вы используете Gunicorn -it рекомендует , используя proxy_pass не uwsgi_pass.