Почему я продолжаю получать предупреждение: Cook ie, связанный с ресурсом по адресу http://127.0.0.1/, был установлен с `SameSite = None`, но без` Secure`

Question

Полное предупреждение:

A cookie associated with a resource at http://127.0.0.1/ was set with `SameSite=None` but without `Secure`. A future release of Chrome will only deliver cookies marked `SameSite=None` if they are also marked `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5633521622188032. 

Однако я установил файлы cookie, например:

res.cookie("token", token, {httpOnly: true, sameSite: 'none', secure: true});

Есть ли способ избавиться от этого предупреждения?

Answer 1

Для повара ie, необходимого для стороннего или межсайтового контекста, вы должны установить и SameSite=None, и Secure, как вы делаете в исходном примере.

Первый вопрос хотя - вам обязательно нужно, чтобы этот повар ie был кросс-сайтом? Другими словами, ожидаете ли вы, что разные сайты направят к вам запрос, требующий отправки этого cook ie? Примеры здесь: если ваш сайт встроен в iframe на другом сайте, размещает изображения, в которые вы хотите включить файлы cookie, или создает токен для дополнительной безопасности при отправке межсайтовой формы.

Если нет, вместо SameSite=Lax для этого повара ie. Таким образом, он будет отправляться только для запросов на вашем сайте.

Однако, когда вы разрабатываете на 127.0.0.1 или localhost, у вас обычно нет сертификата для действительного HTTPS-соединения. Я бы посоветовал в Express использовать app.get('env);, чтобы получить текущую среду ('development' или 'production'), а затем использовать это, чтобы выбрать, установить ли вы Secure или нет.

Например:

const express = require('express');
const app = express();

if (app.get('env') !== 'development') {
  // production settings, assume HTTPS
  app.set('cookie config', { httpOnly: true, sameSite: 'lax', secure: true });
} else {
  // development settings, no HTTPS
  app.set('cookie config', { httpOnly: true, sameSite: 'lax' });
}

// Later on when setting a cookie within your route, middleware, etc.
res.cookie('token', token, app.get('cookie config'));

Вы также можете настроить несколько конфигураций Cook ie, если у вас разные варианты использования на вашем сайте.

if (app.get('env') !== 'development') {
  // production settings, assume HTTPS
  app.set('cookie config 1p', { httpOnly: true, sameSite: 'lax', secure: true });
  app.set('cookie config 3p', { httpOnly: true, sameSite: 'none', secure: true });
} else {
  // development settings, no HTTPS
  app.set('cookie config 1p', { httpOnly: true, sameSite: 'lax' });
  // Assumes that I'm hosting all my test sites under localhost,
  // so the browser won't actually see them as 3p
  app.set('cookie config 3p', { httpOnly: true, sameSite: 'lax' });
}

Вы также можете посмотреть создать самозаверяющий сертификат для вашей среды localhost, но это может быть немного неудобно. Если вы собираетесь это сделать, возможно, лучше будет использовать какой-нибудь контейнер или виртуальную машину для разработки.