WedX - журнал о программировании и компьютерных науках

Заголовки файлов cookie присутствуют, но файлы cookie не сохраняются в браузере

Помогите, пожалуйста, разобраться, почему браузер (Chrome и любые другие) не устанавливает куки, а заголовок Set-Cookie присутствует в заголовках ответа:

Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Length: 345
Content-Type: application/json; charset=utf-8
Date: Sat, 18 Jan 2020 21:15:53 GMT
ETag: W/"159-UXuykOchcveuYBb7xZpN5Luf3jU"
Set-Cookie: jwt=************; Path=/; Expires=Fri, 17 Apr 2020 21:15:53 GMT; HttpOnly
Strict-Transport-Security: max-age=15552000; includeSubDomains
X-Content-Type-Options: nosniff
X-DNS-Prefetch-Control: off
X-Download-Options: noopen
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block

Мое приложение работает по адресу: https://localhost:8080

javascript vue.js express cookies
19.01.2020

  • Как вы определили, что куки не установлены? 19.01.2020
  • Приложение --› Cookies для localhost:8080 пусты 19.01.2020
  • Я до сих пор не уверен, где Application --› Cookies? И, я надеюсь, вы знаете, что файлы cookie хранятся только на хосте, а не на порту. 19.01.2020
  • Я не вижу ничего явно плохого в печенье. Вы убедились, что он не отправляется обратно на хост при последующем запросе? Вы можете просто заглянуть на вкладку «Сеть» отладчика Chrome и посмотреть, что отправлено по другому запросу на тот же хост. 19.01.2020
  • Нажмите F12 в Chrome, и в devtools вы найдете вкладку Application, в разделе Storage есть 19.01.2020
  • Я нашел тот же вопрос на github: github.com/axios/axios/issues/1553но это не помогло решить мою проблему 19.01.2020
  • Запрос исходит от вызова axios? Потому что, если это так, вы должны установить конкретную опцию в своем вызове axios, чтобы он отправлял файлы cookie с запросом. 19.01.2020
  • К вашему сведению, я попробовал res.set("Set-Cookie", "jwt=1234567890; Path=/; Expires=Fri, 17 Apr 2020 21:15:53 GMT; HttpOnly"); на сервере Express здесь, на локальном хосте, и файл cookie был прекрасно сохранен в браузере и отправлен обратно на сервер при следующем запросе. Итак, должно быть что-то не так с вашим конкретным кодом. Я думаю, вам придется показать нам соответствующий код, как клиентский, так и серверный. Тоже пробовал, res.cookie("jwt", "987654321", {path: "/", httpOnly: true, expires: new Date(Date.now() + 900000)}) тоже сработало. 19.01.2020
  • Итак, я не могу воспроизвести вашу проблему с моим собственным кодом. Проблема должна быть в вашем конкретном коде. Невозможно отлаживать дальше, не видя этот код. 19.01.2020
  • Я сделал почти то же самое: res.cookie('jwt', token, cookieOptions), но браузер не сохраняет cookie 19.01.2020
  • Ну, работает для меня. Не так много мы можем сказать, не видя вашего ФАКТИЧЕСКОГО кода. Поскольку в res.cookie() нет ничего плохого, в вашем коде должно быть что-то другое. 19.01.2020
  • Вот серверная часть: github.com/russian-stan /ms-backend/blob/мастер/контроллеры/ 19.01.2020
  • Нет, мой сервер работает на localhost:3000. 19.01.2020
  • Я удалил заголовок Strict-Transport-Security, но это не помогает 19.01.2020
  • Я думаю, моя проблема в том, что у меня есть клиентское приложение на localhost:8080 и серверное приложение на localhost:3000. Браузер сохраняет куки, если использует любой localhost:3000. Но интересно то, что с Postman все в порядке, если использовать его для отправки запросов вместо localhost: 8080, но не с localhost: 8080, он не работает, он получает заголовок Set-Cookie, но не сохраняет cookie в браузере 19.01.2020

Ответы:


1

Вы, кажется, используете CORS.

Чтобы установить файл cookie с помощью CORS, вам необходимо установить флаг withCredentials при выполнении запроса.

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials

Сервер должен будет вернуть заголовок Access-Control-Allow-Credentials: true. Вам также необходимо изменить Access-Control-Allow-Origin: *, так как вы не можете использовать подстановочные знаки в запросе, который использует учетные данные.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Credentials
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin< /а>

Начиная с Chrome 80 вам также необходимо установить директивы SameSite=None и Secure для файла cookie.

https://www.chromestatus.com/feature/5088147346030592
https://www.chromestatus.com/feature/5633521622188032
https://www.troyhunt.com/promiscuous-cookies-and-their-impending-death-via-the-samesite-policy/

Чтобы проверить, установлен ли файл cookie, вы не можете просто открыть Приложение > Файлы cookie и проверить наличие файла cookie. Файл cookie будет установлен для localhost:3000, поэтому просмотр файлов cookie для localhost:8080 не покажет его. Вместо этого вам нужно будет открыть другую вкладку, указывающую на localhost:3000, а затем посмотреть там Приложение > Файлы cookie. Файлы cookie распределяются между вкладками, поэтому вы по-прежнему сможете видеть файлы cookie, установленные на исходной вкладке localhost:8080.

Заставить файлы cookie разных источников работать с Safari — отдельная задача. Если вам нужно поддерживать Safari, я предлагаю вам провести некоторое исследование, поскольку вам может потребоваться полностью принять другую стратегию.

19.01.2020
Новые материалы
Как проанализировать работу вашего классификатора?
Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..
Работа с цепями Маркова, часть 4 (Машинное обучение)
Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..
Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..
Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..
Учебные заметки: создание моего первого пакета Node.js
Это мои обучающие заметки, когда я научился создавать свой самый первый пакет Node.js, распространяемый через npm. Оглавление Глоссарий I. Новый пакет 1.1 советы по инициализации..
Забудьте о Matplotlib: улучшите визуализацию данных с помощью умопомрачительных функций Seaborn!
Примечание. Эта запись в блоге предполагает базовое знакомство с Python и концепциями анализа данных. Привет, энтузиасты данных! Добро пожаловать в мой блог, где я расскажу о невероятных..
ИИ в аэрокосмической отрасли
Каждый полет – это шаг вперед к великой мечте. Чтобы это происходило в их собственном темпе, необходима команда астронавтов для погони за космосом и команда технического обслуживания..
Для любых предложений по сайту: [email protected]