Невозможно получить доступ к файлу cookie в JavaScript, document.cookie пуст

Делаю проект с авторизацией с помощью кукисов. Токен доступа с именем пользователя отправляется js-клиенту сервером, и на сетевом мониторе в браузере я вижу файлы cookie, отправляемые с запросами от fetch. После перезагрузки страницы я хочу прочитать сохраненные файлы cookie и, если они присутствуют, сохранить их, чтобы пользователь мог войти в систему.

Проблема в том, что хранилище->Cookies в Firefox пусто, а document.cookie возвращает пустую строку.

Бэкенд — Python FastAPI, куки настраиваются следующим образом:

login_manager.set_cookie(response, token) # httponly=True
response.set_cookie("blueberry-user", data.login, httponly=False, expires=timedelta(days=1))

Код в js-интерфейсе, который отправляет запрос на авторизацию и получает файлы cookie:

let response = await fetch(backendUrl + handleUrl, {
      method: "post",
      mode: "cors",
      credentials: "include",
      body: JSON.stringify({ login: login, password: password }),
      headers: {
        "Content-Type": "application/json",
      },
    });

Файлы cookie устанавливаются и отправляются со следующим запросом: imgimg

Сначала я думал, что проблема в httponly, но когда я отключил его для установки файлов cookie, это не помогло.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
77
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Проблема решена добавлением domain = "blueberry.adefe.xyz" в куки в ответ. Внутренний URL-адрес: api.blueberry.adefe.xyz, внешний URL-адрес: blueberry.adefe.xyz, возможно, проблема заключалась в файлах cookie с перекрестным происхождением.

Полный код для добавления файла cookie в ответ FastAPI:

@router.post("/user/login", tags=["Authentification"])
def post_login(data: AuthRequestModel, response: Response):
 ...
 response.set_cookie(
   "blueberry-user",
   data.login,
   httponly=False,
   expires=timedelta(days=1),
   domain = "blueberry.adefe.xyz",
  )
  response.status_code = status.HTTP_200_OK
  return response

До сих пор не понимаю, почему файлы cookie автоматически сохранялись и отправлялись вместе с запросами, но были недоступны в js и в браузере.

Другие вопросы по теме