Home/ Questions/Q 37365
In Process

askthedev.com Latest Questions

Asked: 2025-01-03T12:14:44+05:30

Why are cookies with the SameSite=None attribute not being set by the browser when making requests to a web API?

So, I’ve been diving into the world of web development lately, and I’ve run into a bit of a head-scratcher that I hope someone can help me out with. I’ve got this web application that relies on a backend API, and I’m trying to manage user sessions using cookies. But here’s the kicker: I’ve set the SameSite attribute of my cookies to None, thinking that would allow them to be sent across different sites. However, my browser just isn’t setting those cookies when I make requests to the API. What gives?

I’ve read that SameSite=None requires the Secure attribute, so I made sure my cookies are marked as secure too. I’m working on a local setup with HTTPS (thanks to some help from my friend on setting up a self-signed certificate), so that shouldn’t be an issue. But, although I can see the cookies in my developer tools, they aren’t being sent in the request to the API.

Could it be that there’s something wrong with how I’ve configured the API itself? Maybe some CORS settings I’m overlooking? I’ve checked, and it seems like my API allows credentials, but I wonder if there’s more to it. Also, I noticed my browser’s console throwing up some warnings. I’m not sure if they’re related, but it’s been mentioning something about cross-site cookie policies and how they’ve tightened since Chrome 80.

Is the problem that I’m using a local environment, and that’s throwing everything off? Or is there something else entirely? I’m really stuck here, and I’d love to hear about any experiences you’ve had with this SameSite attribute. How did you solve similar issues? Any tips or tricks that could point me in the right direction? Would really appreciate any insight you can offer.

Share

    Leave an answer

    You must login to add an answer.

    Need An Account,

    2 Answers

    1. The issue you’re encountering with cookies not being sent in requests to your API, despite having the SameSite attribute set to None and the Secure attribute set correctly, could indeed be related to several factors, including CORS (Cross-Origin Resource Sharing) configuration. Since you are running in a local setup with HTTPS, make sure that your API is configured to allow credentials by setting the Access-Control-Allow-Credentials header to true. Additionally, your API should also explicitly allow the origin from which you’re making your requests by setting the Access-Control-Allow-Origin header to the specific origin of your frontend application, rather than using a wildcard (*). This helps ensure that the browser understands your intent to share cookies across domains while maintaining security measures.

      Another important point to address is the “SameSite” cookie policy changes introduced in Chrome 80 and subsequent browser updates. These changes mean that cookies marked as SameSite=None must also be Secure, which you appear to have already implemented. However, issues may arise if you attempt to set cookies on an unsecure connection, so double-check that all your requests are indeed being sent over HTTPS. As for the browser warnings you’re seeing, they might be indicative of other misconfigurations in security policies or headers that could further affect cookie behavior. Examining those warnings closely may provide additional clues. Also, consider testing your application on a different browser or using the latest version of your current browser to rule out any specific browser handling quirks.

    2. It sounds like you’re having a bit of a tough time with cookies and API requests! I totally get how confusing it can be, especially with the new SameSite cookie rules.

      So, from what you’ve described, it seems like you have the right idea with setting SameSite=None and marking your cookies as Secure. However, those cookies might not be sent if there’s an issue somewhere else.

      One big thing to check is your API’s CORS (Cross-Origin Resource Sharing) settings. Since you’re trying to send cookies cross-origin, your API needs to explicitly allow credentials. You should ensure that:

      • Your API server sets the Access-Control-Allow-Origin header to the domain your web app is running on, and it can’t just be a wildcard (*).
      • It also needs to include Access-Control-Allow-Credentials: true in its response headers. This is super important!

      If these headers aren’t configured correctly, the browser will block the cookies from being sent with requests, even if they’re visible in your cookies storage.

      As for the warning from the browser, it’s likely related to the stricter cookie policies that were enforced in recent updates. Browsers are taking security seriously, and that’s a good thing, but it can make things a bit tricky for developers.

      Being on a local setup can add some complications too, like possible issues with self-signed certificates. Just make sure your browser trusts the certificate you’re using. If it’s not trusted, even HTTPS might not work as intended.

      One last thing to try is checking your network requests in the browser’s developer tools. Look for the requests to your API and see if the cookies are included in the request headers. This might give you a hint of what’s going wrong!

      Hope this helps clear things up a bit! Keep tinkering, and you’ll get it sorted out!