Django Rest Framework не может получить CSRF-токен от React

Я потратил на это шесть часов и до сих пор не могу справиться с получением CSRF Token и ID сессии.

У меня есть две простые функции:

@api_view(["GET"])
@ensure_csrf_cookie
def getCsrf(request):
    return Response({'success': get_token(request)})

@method_decorator(csrf_exempt, name='post')
class LoginView(views.APIView):

    permission_classes = (AllowAny,)

    def post(self, request, format=None):
        serializer = LoginSerializer(data=self.request.data, context={ 'request': self.request })
        serializer.is_valid(raise_exception=True)
        user = serializer.validated_data['user']
        login(request, user)
        return Response(None, status=status.HTTP_202_ACCEPTED)

У меня установлен corsheaders и у меня такие настройки:

CORS_ALLOWED_ORIGINS = [
    'http://127.0.0.1:3000',
    'http://localhost:3000',
    'http://127.0.0.1:8000',
    'http://localhost:8000',
]

CSRF_TRUSTED_ORIGINS = [
    'http://127.0.0.1:3000', 
    'http://localhost:3000',
    'http://127.0.0.1:8000', 
    'http://localhost:8000',
]

CORS_ALLOW_HEADERS = ('Access-Control-Allow-Origin', 'Access-Control-Allow-Credentials', 'Authorization', 'Content-Type', 'Cache-Control', 'X-Requested-With', 'x-csrftoken')
CORS_ALLOW_CREDENTIALS = True

CSRF_COOKIE_HTTPONLY = False
SESSION_COOKIE_HTTPONLY = False
CSRF_USE_SESSIONS = False

CSRF_COOKIE_SECURE = False
SESSION_COOKIE_SECURE = False
SESSION_COOKIE_SAMESITE = 'None'
CSRF_COOKIE_SAMESITE = 'None'

Итак, оба этих куки появляются в ответах. Ни один из них не записывается в браузере. Я перепробовал все, что нашел. Это моя часть React

axios.defaults.withCredentials = true;

useEffect(() => {
    axios.get(`http://127.0.0.1:8000/csrf/`)
        .then(response => {
            Cookies.set('csrftoken', response['data']['csrf']);
        })
        .catch(error => {
            console.log(error);
        });
}, []);

function onSubmit(e) {
    e.preventDefault();

    let data = {
        username: e.target.username.value,
        password: e.target.password.value
    };

    const config = {     
        headers: { 
            'content-type': 'application/json',
            'Access-Control-Allow-Credentials': 'true',
            'Access-Control-Allow-Origin': 'http://localhost:8000',
            'X-CSRFToken': Cookies.get('csrftoken')
        },
        withCredentials: true,
        crossDomain: true
    }

    axios.post(`http://127.0.0.1:8000/login/`, JSON.stringify(data), config)
        .then(response => {
            console.log(response);
        })
        .catch(error => {
            console.log(error);
        });
}

Я бы хотел не устанавливать cookies самостоятельно, как это сейчас происходит в useEffect, но я не могу заставить его работать. Я не знаю, как получить идентификатор сессии, я хочу, чтобы он работал, как полагается. Я пробовал Chrome и Firefox. Ни один из них не сохраняет эти куки

const get_cookie = (name) => {
    var cookieValue = null;
    if (document.cookie && document.cookie !== '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = jQuery.trim(cookies[i]);
            if (cookie.substring(0, name.length + 1) === (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
  };

// then
get_cookie('csrftoken')
Вернуться на верх