Flask и приложение React в одном Docker контейнере

Question

Добрый день, SO,

Я знаю, что это плохая практика и что у меня должно быть одно приложение на контейнер, но есть ли у меня способ иметь две службы, работающие одновременно в одном контейнере, и как мне go написать для него Dockerfile?

Мой текущий Dockerfile для Flask (Backend) приложения:

FROM python:3.6.9-slim-buster

WORKDIR /app/flask_backend

ENV PYTHONPATH "${PYTHONPATH}:/app"

COPY ./flask_backend ./

COPY requirements.txt .
RUN pip install -r requirements.txt

CMD python3 app/webapp/app.py

My React (Frontend) Dockerfile:

FROM node:12.18.0-alpine as build

WORKDIR /app/react_frontend

ENV PATH /app/node_modules/.bin:$PATH
ENV NODE_OPTIONS="--max-old-space-size=8192"

COPY ./react_frontend/package.json ./
COPY ./react_frontend/package-lock.json ./

RUN npm ci
RUN npm install react-scripts@3.4.1 -g
RUN npm install serve -g

COPY ./react_frontend ./

CMD ["serve", "-s", "build", "-l", "3000"]

Моя попытка запустить оба приложения в одном и том же Docker контейнере заключалась в объединении двух файлов Docker, но полученный контейнер не содержит данных из первого файла Docker, и я не знаю, как действовать дальше.

Мой объединенный файл Dockerfile:

FROM python:3.6.9-slim-buster

WORKDIR /app/flask_backend

ENV PYTHONPATH "${PYTHONPATH}:/app"

COPY ./flask_backend ./

COPY requirements.txt .
RUN pip install -r requirements.txt

CMD python3 app/webapp/app.py

FROM node:12.18.0-alpine as build

WORKDIR /app/react_frontend

ENV PATH /app/node_modules/.bin:$PATH
ENV NODE_OPTIONS="--max-old-space-size=8192"

COPY ./react_frontend/package.json ./
COPY ./react_frontend/package-lock.json ./

RUN npm ci
RUN npm install react-scripts@3.4.1 -g
RUN npm install serve -g

COPY ./react_frontend ./

CMD ["serve", "-s", "build", "-l", "3000"]

Я новичок в использовании Docker, и поэтому предвижу, что возникнет несколько проблем, таких как связь между двумя приложениями (Backend использует порт 5000), используя этот метод. Будем очень признательны за любое руководство!

Answer 1

Приложение React обычно не имеет сервера как такового (кроме Docker настроек только для разработки). Вместо этого вы запускаете такой инструмент, как Webpack, чтобы скомпилировать его в файлы stati c, которые затем можно передать браузеру, который затем запускает их.

На вашей хост-системе вы должны запустить что-то вроде

yarn build

, что создает каталог dist; затем вы скопируете это в свой каталог Flask stati c .

Если вы сделаете это заблаговременно, то вы сможете запустить свое приложение из Python, что значительно упростит разработку и настройку тестирования, а отображаемый файл Docker не изменится.

Если вы хотите полностью построить его на Docker (например, более Docker - родная автоматизированная система сборки) многоступенчатая сборка здесь хорошо сочетается. Вы можете использовать первый этап для создания интерфейсного приложения, а затем COPY это в финальном приложении на втором этапе. Это выглядит примерно так:

FROM node:12.18.0-alpine as build
WORKDIR /app/react_frontend
COPY ./react_frontend/package.json ./
COPY ./react_frontend/package-lock.json ./
RUN npm ci
COPY ./react_frontend ./
RUN npm run build

FROM python:3.6.9-slim-buster
WORKDIR /app/flask_backend
ENV PYTHONPATH "${PYTHONPATH}:/app"

COPY requirements.txt .
RUN pip install -r requirements.txt

COPY ./flask_backend ./
COPY --from=build /app/react_frontend/dist/ ./static/

CMD python3 app/webapp/app.py

Этот подход несовместим с настройками, которые перезаписывают содержимое образа Docker с помощью привязок. Установка узла, отличного от Docker, и установки Python будет намного более простой средой разработки, и для этой конкретной установки вряд ли будет существенно отличаться от установки Docker.