Как использовать токен csrf с django, react и axios и nginx

Вот уже несколько часов я получаю следующие ошибки при выполнении post запроса к бэкенду из react frontend

Access to XMLHttpRequest at 'https ://api.foo.com/api/create/' from origin 'https ://www.foo.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Мое приложение полного стека работало правильно, react front end, django backend, инфраструктура из s3 для react, оба размещены на aws cloudfront с использованием terraform, пока я не попытался реализовать токен csrf ниже

я создал следующий конфиг

реагировать

axios.defaults.xsrfHeaderName = "X-CSRFToken";
axios.defaults.xsrfCookieName = 'csrftoken';

axios.defaults.withCredentials = true

const Create = () => {
    const [fields, handleFieldChange] = FormFields({
        name: "",
    });

    const options = {
        headers: {
            'Content-Type': 'application/json',
        }
    };

    const handleSubmit = (e) => {
        e.preventDefault();

        axios.post("https ://api.foo.com/create/", fields, options)
        .then(response => {
...

django settings.py

CORS_ORIGIN_ALLOW_ALL = False

CORS_ALLOW_CREDENTIALS = True

CSRF_COOKIE_NAME = "csrftoken"

CORS_ALLOW_METHODS = [
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
]

CORS_ALLOW_HEADERS = [
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
    'Access-Control-Allow-Origin',
]

nginx

...
location / {
                add_header 'Access-Control-Allow-Origin' 'https ://www.foo.com';
                add_header 'Access-Control-Allow-Credentials' 'true';
                add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT,DELETE,PATCH';
                add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,Keep-Alive,X-Requested-With,If-Modified-Since,X-CSRFToken';
                ...
        }

Любая помощь будет очень признательна, спасибо

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