Why am I getting "Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute"?

CookiesExpress Session

Cookies Problem Overview


In a Chrome warning, it says:

> Specify SameSite=None and Secure if the cookie should be sent in cross-site requests. This enables third-party use.

How do I do this correctly using express-session?

app.use(
  cors({
    credentials: true,
    origin: ["http://localhost:3000", "https://elated-jackson-28b73e.netlify.app"] //Swap this with the client url 
  })
);
var sess = {
  secret: 'keyboard cat',
  cookie: {}
}

if (app.get('env') === 'production') {
  app.set('trust proxy', 1) // trust first proxy
  sess.cookie.secure = true // serve secure cookies
  sess.cookie.sameSite = 'none'
}

app.use(session(sess))

Cookies Solutions


Solution 1 - Cookies

you are getting this because you are using a resource from another site and that server is attempting to set a "cookie" but, it does not have the SameSite attribute set, which is being reported in newer versions of browsers.

this (may) also be shown if you are trying to access the server page from local computer (xampp), which generally doesn't has SSL installed;

set the header line in your server page (if in PHP) as below:
header("Set-Cookie: cross-site-cookie=whatever; SameSite=None; Secure");

(remember: this must be solved from the server side.)

Solution 2 - Cookies

i got the same issue when run my code in localhost. The affected resource is _ga, _gid, _utma, _utmz. All of them from unpkg.com and i got marker image leaflet failed request but doesnt affect the page.

since i dont understand what the specific problem so i just delete the affected resource cookies in inspect element and the code will run without notif again.

thought i know if it's better to not answer based by personal experience. just tell me if it's not help at all.

Solution 3 - Cookies

You're missing the SameSite Attribute!

You can fix this by:

➡️ Specify "SameSite=None" and "Secure" if the cookie should be sent in cross-site requests. This enables third-party use.

➡️ Specify "SameSite=Strict" or "SameSite=Lax" if the cookie should not be sent in cross-site requests.

⚠️ Caution: A number of older versions of browsers including Chrome, Safari, and UC browser are incompatible with the new "None" attribute and may ignore or restrict the cookie. This behavior is fixed in current versions, but you should check your traffic to determine what proportion of your users are affected. You can see the list of known incompatible clients on the Chromium site.

⚠️ Caution: Neither "Strict" nor "Lax" are a complete solution for your site's security. Cookies are sent as part of the user's request and you should treat them the same as any other user input. That means sanitizing and validating the input. Never use a cookie to store data you consider a server-side secret.

Solution 4 - Cookies

No attribute set:

Set-Cookie: promo_shown=1

Default behaviour applied:

Set-Cookie: promo_shown=1; SameSite=Lax

Rejected:

Set-Cookie: widget_session=abc123; SameSite=None

Accepted:

Set-Cookie: widget_session=abc123; SameSite=None; Secure

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSquirrlView Question on Stackoverflow
Solution 1 - Cookiessifr_dot_inView Answer on Stackoverflow
Solution 2 - CookiesastagaView Answer on Stackoverflow
Solution 3 - CookiesNotBeluga981View Answer on Stackoverflow
Solution 4 - CookiesNotBeluga981View Answer on Stackoverflow