#django #reactjs #docker #nginx
#django #reactjs #docker #nginx
Вопрос:
Я — в очередной раз — очень запутался с nginx, docker и react.
Вот что я хочу: 1.) api Django REST, который предоставляет порт только локально 2.) Я хочу, чтобы статические файлы REST api обрабатывались nginx 3.) интерфейс ReactJS, который обслуживается через nginx на порту 80 (я не знаю, обязательно ли обслуживать react через nginx — но я слышал, что это уменьшает размер изображения).
Проблема: это не работает. Все контейнеры могут запускаться по отдельности, но их обслуживание через docker compose не будет выполняться должным образом. Кажется, я не могу подключиться через прокси к api и интерфейсу.
Я намекаю на свою проблему: я вижу, что изображение, которое я накладываю в ReactJS «tiangolo / node-frontend: 10», также копирует файл nginx.conf, который может перезаписать мой.
Используя миллион руководств, я здесь:
nginx.conf
upstream website_rest {
server restapi:8000;
}
upstream website_frontend {
server frontend:8080;
}
server {
listen 80;
location /rest_call/ {
proxy_pass http://website_rest;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_redirect off;
}
location / {
proxy_pass http://frontend;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_redirect off;
}
location /rest_call/staticfiles/ {
alias /usr/src/website-dj/staticfiles/;
}
}
Это файл dockerfile для react:
# Stage 0, "build-stage", based on Node.js, to build and compile the frontend
FROM tiangolo/node-frontend:10 as build-stage
WORKDIR /website-rj
COPY package*.json /website-rj/
RUN npm install
COPY ./ /website-rj/
RUN npm run build
# Stage 1, based on Nginx, to have only the compiled app, ready for production with Nginx
FROM nginx:1.15
COPY --from=build-stage /website-rj/build/ /usr/share/nginx/html
# Copy the default nginx.conf provided by tiangolo/node-frontend
COPY --from=build-stage /nginx.conf /etc/nginx/conf.d/default.conf
Dockercompose:
version: '3.7'
services:
frontend:
expose:
- 8080
build: "./website_rj_docker"
volumes:
- ./website_rj_docker/build:/usr/src/website-rj/
restapi:
build: "./website_dj_docker/"
# command: python /usr/src/website-dj/manage.py runserver 0.0.0.0:8000 --settings=rest.settings.production
command: gunicorn rest.wsgi:application --bind 0.0.0.0:8000
volumes:
- ./website_dj_docker/:/usr/src/website-dj/
- static_volume:/usr/src/website-dj/staticfiles
expose:
- 8000
environment:
- SECRET_KEY='something...'
- SQL_ENGINE=django.db.backends.postgresql
- SQL_DATABASE=postgres
- SQL_USER=something...
- SQL_PASSWORD=something...
- SQL_HOST=db
- SQL_PORT=5432
- DATABASE=postgres
depends_on:
- db
db:
image: postgres:10.5-alpine
volumes:
- postgres_data:/var/lib/postgresql/data/
nginx:
build: ./nginx
volumes:
- static_volume:/usr/src/website-dj/staticfiles
ports:
- 1337:80
depends_on:
- restapi
Комментарии:
1. Проблема: тома, определенные в вашем файле docker compose, недоступны во время сборки docker, а только при запуске docker (compose). Единственное решение, которое я вижу, — это иметь узел-контейнер, создающий ваше приложение react в качестве run-CMD, используя ваш том docker, который затем будет доступен из вашего контейнера nginx — также только при запуске docker (compose).
2. Открытая проблема, связанная с монтированием томов docker во время сборки docker: github.com/moby/moby/issues/14080
3. Хороший пример, показывающий, как объединить Docker, react, серверную службу и nginx: github.com/ifischer/django-nginx-reactjs-docker