8

Recently, Chrome changed the policy for whether cookies are attached to cross-origin requests. Now, cookies are not attached to cross-origin requests unless:

  1. The SameSite cookie attribute is either Lax or None and the request was initiated by a user action, or
  2. The SameSite cookie attribute is None and the Secure cookie attribute is true, meaning that the cross-origin request has to use the https scheme.

(The above is not wrong, but it is slightly simplified. Here is a more thorough writeup.)

In my development environment, I use a tool to compile my development language and hot-reload the changes into my browser tab. This tool serves the frontend code on its own port, and the backend is served on a separate port by a separate process, so we're dealing with cross-origin requests from browser to backend. Naturally, both the frontend and backend are served from localhost with scheme http. And many of the requests that the frontend app makes are not initiated by user action yet still need cookies for auth purposes.

As a result, anything requiring cookies will not work in my development environment. (Yeah, spent quite a while figuring that one out…)

My question is: how can I bypass, work around, or disable these SameSite cookie security restrictions for my development environment in an easy way that won't decrease my security as I'm browsing other sites?

It would be nice if, for example, there was a way to add localhost to a whitelist of origins in my browser that allowed SameSite=None cookies even without a Secure=true attribute. Slightly less nice, but still acceptable, would be an easy way to wrap or proxy my http://localhost:<port> services so that they can be accessed via the https scheme. Or perhaps there's another approach using some obscure cookie magic.

Update 2021-09-16: @tommueller points out that this question is related. This question is different in that it talks about a [cross origin but] same site situation, where both origins are from localhost.

2

2 Answers 2

9

If all of your development environment is hosted under localhost then requests between different ports, while cross-origin, still count as same-site. See: https://web.dev/same-site-same-origin/

In your development environment, you can either drop SameSite=None; Secure completely or explicitly set SameSite=Lax.

Alternatively, look at creating self-signed certificates for localhost or local vms to better match your production environment - though that's slightly more involved.

2

At the time of this writing, Firefox does not default same-site to lax when unspecified, but Chrome does. This flag can be disabled in Chrome here, but warning that this disables the flag for all sites you visit, not just your development site.

chrome://flags/#same-site-by-default-cookies

Source: https://www.chromium.org/updates/same-site/faq

3
  • 1
    This flag has bee removed Jun 1, 2021 at 17:37
  • @DerekLawrence you can still set it by a chrome launch option until Chrome 94. See my answer here: stackoverflow.com/a/60592944/4742503
    – Will
    Jun 16, 2021 at 22:58
  • I got around it by adding localhost.domain.ca to my host file to point to my localhost server. Then going to this url "tricks" chrome for the time being as it does give off a warning saying it will be disabled until the future Jun 17, 2021 at 22:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.