Токен доступа dj-rest-auth не отправляется из react font-end в django back-end

Я делаю SPA с фронтендом на React и бэкендом на Django. Для аутентификации пользователей я использую dj_rest_auth, который оборачивает allauth для предоставления интерфейса REST API.

dj-rest-auth предоставляет конечную точку «login», которая отправляет обратно cookies токенов доступа и обновления. Он также предоставляет конечную точку «user», которая возвращает имя пользователя, электронную почту, имя и фамилию.

Оба работают как ожидалось в моем клиенте API (Bruno), НО, я не могу заставить «пользовательский» API работать в моем внешнем коде. Мой браузер не отправляет cookies на сервер.

Вот скриншоты, сделанные Бруно. Обратите внимание, как сохраняются куки, и как работает получение информации о пользователе:

login api works access and refresh cookies are saved in Bruno user api returns user info only using cookies. no json body is passed.

Вот мой запрос на вход в систему из приложения React и заголовки set-cookie (они же cookies ответа):

        // ...
        fetch(BACKEND_URL + "/api/auth/login", {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
            },
            body: JSON.stringify({
                username: username,
                password: password,
            }),
        })
            .then(async (response) => { //...

study_stream_auth_cookie=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0b2tlbl90eXBlIjoiYWNjZXNzIiwiZXhwIjoxNzM3MjM3MTEyLCJpYXQiOjE3MzcyMzM1MTIsImp0aSI6IjNjZDc4ZjI3ZWYyNTQwMzI4MmVmNjAwODRiMjcxYzU0IiwidXNlcl9pZCI6NDB9.JK-SKSGMWuTBFm4JFk4-T8RqNEf2vwANrS4-h7P9UMY; expires=Sat, 18 Jan 2025 21:51:52 GMT; Max-Age=3600; Path=/; SameSite=Lax

study_stream_refresh_cookie=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0b2tlbl90eXBlIjoicmVmcmVzaCIsImV4cCI6MTc0NTAwOTUxMiwiaWF0IjoxNzM3MjMzNTEyLCJqdGkiOiJhMTljYjg1ZDI5Zjk0NTQyOWUzMjM2ODdmY2IxYzQ0YiIsInVzZXJfaWQiOjQwfQ.xvfB61xkq9NUzQSZeAJmXSYaFrYcSfrsJ9QX2u635LU; expires=Fri, 18 Apr 2025 20:51:52 GMT; Max-Age=7776000; Path=/; SameSite=Lax

sessionid=qt2yxaiitghqavr74xvvl8icjlckq6by; expires=Sat, 01 Feb 2025 20:51:52 GMT; HttpOnly; Max-Age=1209600; Path=/; SameSite=None; Secure

А вот мой GET-запрос «user». Заметьте, что единственным cookie, отправленным здесь, является csrftoken, который не имеет отношения к делу.

    const response = await fetch(BACKEND_URL + "/api/auth/user/", {
        method: "GET",
        credentials: 'include',
    });
    const data = await response.json();

    console.log(data); // debug

Brave devtools only showing csrftoken when I inspect the "user" API request under the Network tab

Консоль выдает следующее сообщение, которое в точности соответствует тому, что я получаю в Bruno, когда очищаю свои cookies:

{detail: 'Authentication credentials were not provided.'}

Я уже добавил эти флаги в Django, чтобы попытаться исправить ситуацию, но безуспешно:

CORS_ALLOW_CREDENTIALS = True
# SESSION_COOKIE_SAMESITE = 'None'
# vv pulled from https://stackoverflow.com/a/63590219/14751074
CSRF_COOKIE_SECURE = True
SESSION_COOKIE_SECURE = True
CSRF_COOKIE_SAMESITE = 'None'
SESSION_COOKIE_SAMESITE = 'None'
JWT_AUTH_SAMESITE = None

Вот еще несколько конфигураций и информации от Django и React:

  • Фронт-энд React работает на http://localhost:5173/.
// vars.ts. imported in all files using "BACKEND_URL".
export const BACKEND_URL = "http://localhost:8000"
// same address as django

Как заставить работать аутентификацию на основе jwt-cookie?

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