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

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))


Solution 1:[1]

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:[2]

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:[3]

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:[4]

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

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 astaga
Solution 3 NotBeluga981
Solution 4 NotBeluga981