Контекст: поэтому я создаю веб-приложение для некоммерческой организации. Этот проект начался в школе, и я хотел использовать некоторые «новые» технологии.
Я решил создать несколько сервисов и управлять ими с помощью docker -compose. В основном у меня есть эти сервисы:
- API бэкэнда с django -rest-framework
- Фронтенд с vuejs
- обратный прокси с nginx
Все работает нормально, и я близок к концу проекта. Поэтому я хотел проверить свою архитектуру в тестовой среде. Проблема в том, что я большой новичок в отношении развертывания, и, возможно, я выбрал неправильный вариант.
Вот мое мнение: некоммерческая организация не имеет много денег, поэтому я попытался протестировать один из самое дешевое решение: арендовать виртуальную машину, клонировать мой проект и запустить на компьютере docker -compose.
Проблема, с которой я сталкиваюсь, заключается в том, что все мои запросы (кроме некоторого GET для css) не выполняются т работает в этой среде. У меня есть эта проблема:
- Когда я захожу на свою домашнюю страницу и пытаюсь получить некоторые изображения с моего nginx, я сразу получаю сообщение в консоли: Запрос CORS заблокирован: Запрос CORS не выполнен Успешно.
- После того, как я хочу войти в систему, вместо моего запроса POST, вкладка сети в firefox показывает мне, что есть только опция, которая отправляется, но ответа нет.
Я полагаю, что есть проблема с CORS или чем-то вроде этого, но так как все работает внутри docker, я не смог найти ошибку и исправление. И я не очень понимаю, что здесь происходит. Это действительно проблема CORS? Это связано с docker -композицией или окружением, так как оно отлично работает на моем p c?
Может кто-нибудь мне помочь, пожалуйста?
Вот мой docker -компонентный файл :
version: '3.7'
services:
db:
container_name: db
image: postgres
networks:
- main
ports:
- "5432:5432"
volumes:
- pg-data:/var/lib/postgresql/data
redis:
container_name: redis
image: redis:alpine
networks:
- main
celery:
container_name: celery
build: ./backend
command: bash -c 'celery worker --app=backend.celery:app --loglevel=info'
volumes:
- ./backend:/code
depends_on:
- db
- redis
networks:
- main
nginx:
restart: always
container_name: nginx
build:
context: .
dockerfile: nginx/prod/Dockerfile
ports:
- "80:80"
depends_on:
- backend
volumes:
- ./nginx/prod/prod.conf:/etc/nginx/nginx.conf:ro
- django-static:/usr/src/app/static
- django-media:/usr/src/app/media
networks:
- main
backend:
container_name: backend
build: ./backend
command: /start_prod.sh
volumes:
- .:/code
- django-static:/backend/static
- django-media:/backend/media
ports:
- "8000:8000"
networks:
- main
depends_on:
- db
volumes:
pg-data:
django-static:
django-media:
networks:
main:
driver: bridge
и вот мой nginx conf:
user nginx;
worker_processes 1;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
client_max_body_size 100m;
upstream backend {
server backend:8000;
}
server {
listen 80;
charset utf-8;
root /dist/;
index index.html;
# frontend
location / {
try_files $uri $uri/ @rewrites;
}
location @rewrites {
rewrite ^(.+)$ /index.html last;
}
# backend urls
location ~ ^/(admin|api|auth) {
proxy_redirect off;
proxy_pass http://backend;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
}
# static files
location /static {
autoindex on;
alias /usr/src/app/static;
}
# media files
location /media {
autoindex on;
alias /usr/src/app/media;
}
}
}
Если честно, пока у меня нет большого опыта, я много следил за этим проектом: https://verbose-equals-true.gitlab.io/django-postgres-vue-gitlab-ecs/ Но я хотел что-то другое, поэтому я следовал только первым руководствам и адаптировал следующее.
Я уже пытался использовать django -cors-headers или добавить поддержку CORS в nginx conf, как эти сообщения совет:
Если у кого-то есть ответ или / и совет о том, как лучше развернуть или / и как улучшить мою архитектуру, напишите мне комментарий.