Проблемы CORS с Nginx в качестве обратного прокси для Django

Я использую Nginx в качестве веб-сервера для сервера статических файлов фронтенда и обратного прокси для моего сервера Django. Проблема в том, что у меня возникают проблемы с CORS, когда я делаю запрос с фронтенда. Мой дизайн-план состоял в том, чтобы использовать Apex домен example.com для фронтенда и все вызовы API идут на api.example.com.

Я уже провел тонну исследований и попытался перехватить OPTIONS запрос и т.д., но у меня все еще есть CORS ошибки. Также в Django установлен пакет django-cors, а Axios использует .withDefaultCredentials = true. Моя текущая конфигурация nginx выглядит следующим образом:

server {
    listen 80;
    listen [::]:80;
    server_name $DOMAIN_HOSTNAME;
    root /var/www/example.com/dist;

    location /media {
        alias /var/www/example.com/media/;
    }

    location / {
        try_files $uri $uri/ /index.html =404;
    }
}

upstream djangoserver {
    server django:8000;
}

server {
    listen 80;
    listen [::]:80;
    server_name $API_DOMAIN_HOSTNAME;
    

    location / {
        proxy_pass http://djangoserver;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header 'Access-Control-Allow-Origin' $http_origin;
        proxy_set_header 'Access-Control-Allow-Credentials' 'true';
    

        proxy_redirect off;

        add_header 'Access-Control-Allow-Origin' 'https://example.com';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
        add_header 'Access-Control-Allow-Credentials' 'true';

        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' 'https://example.com';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
            add_header 'Access-Control-Allow-Credentials' 'true';
            return 204;
        }
    }
}

Также, чтобы не было путаницы, nginx обслуживает порт 80, но он находится за cloudflare, который устанавливает https соединение от клиента к сети cloudflares. В настройках Django настроен домен:

# Allowed hosts this django app is allowed to run on.
ALLOWED_HOSTS = [
    "localhost",
    "127.0.0.1",
    os.environ.get('DOMAIN_IP'),
    os.environ.get('FRONTEND_DOMAIN_HOSTNAME')
]


# Cors policy (allowed origins) options...
CORS_ALLOWED_ORIGINS = [
    "http://127.0.0.1",
    "http://127.0.0.1" + ":" + os.environ.get("FRONTEND_PORT"),
    "https://127.0.0.1",
    "https://127.0.0.1" + ":" + os.environ.get("FRONTEND_PORT"),
    "http://localhost",
    "http://localhost" + ":" + os.environ.get("FRONTEND_PORT"),
    "https://localhost",
    "https://localhost" + ":" + os.environ.get("FRONTEND_PORT"),
    "http://" + os.environ.get('FRONTEND_DOMAIN_HOSTNAME'),
    "http://" + os.environ.get('FRONTEND_DOMAIN_HOSTNAME') + ":" + os.environ.get("FRONTEND_PORT"),
    "https://" + os.environ.get('DOMAIN_IP'),
    "https://" + os.environ.get('DOMAIN_IP') + ":" + os.environ.get("FRONTEND_PORT"),
]

CORS_ALLOW_CREDENTIALS = True
CSRF_TRUSTED_ORIGINS = CORS_ALLOWED_ORIGINS

Я делаю что-то не так с моей конструкцией или я просто что-то упускаю? Я совсем новичок в конфигурациях nginx.

Вернуться на верх