React/Express set-cookie not working across different subdomains

Question

I have a React frontend with Express API server, and I am trying to store a JWT in a secure httpOnly cookie for authorization. Below are the relevant parts of my code, which includes everything I've tried from countless Google/StackOverflow searches.

Am I missing something simple? I am trying to avoid storing the JWT in localStorage, but I am just at a loss right now. Nothing seems to work.

API (https://api.mydomain.com):

app.use(cors({ credentials: true, exposedHeaders: ['SET-COOKIE'], origin: 'https://staging.mydomain.com', })); app.post('/auth/login', (request, response) => { ... response.cookie('jwt', JWT.sign({ id: user.id }, ...), { domain: 'mydomain.com', httpOnly: true, sameSite: 'none', secure: true, }); response.json(user); });

Web (https://staging.mydomain.com):

await fetch('https://api.mydomain.com/auth/login', { body: JSON.stringify({ ... }), credentials: 'include', headers: { 'Content-Type': 'application/json', }, method: 'POST', });

I see the set-cookie header in the response, but I do not see the cookie set in the developer tools and it is not passed in subsequent API requests.

Response Headers: access-control-allow-credentials: true access-control-allow-origin: https://staging.mydomain.com access-control-expose-headers: SET-COOKIE set-cookie: jwt=abcde*********.abcde*********.abcde*********; Domain=mydomain.com; Path=/; HttpOnly; Secure; SameSite=None

Ishan Chhabra · Accepted Answer · 2021-12-23 06:52:40Z

On your server, when you are setting the cookie, can you try adding a dot before the domain. The leading dot implies that the cookie is valid for subdomains as well.

response.cookie('jwt', JWT.sign({ id: user.id }, ...), { domain: '.mydomain.com', httpOnly: true, sameSite: 'none', secure: true, });

When the client (here, https://staging.mydomain.com) will receive the Set-Cookie response header, with the trailing dot domain, it would accept the cookie since now the cookie is valid for subdomains too.

On a side note, I find Cookie Editor really helpful for debugging cookies.

Hope this answer helps you! :)

Thank you for the reply! I tried this and, unfortunately, see no change. :(
Oof, nvm that did work. Ironically, I made a typo in my original post that ended up being right. I have credentials inside of headers in my fetch call, but when I typed out the pseudo-code in my post, I put it outside of headers (which ended up being the right way). The cookie is being set correctly now and sent on subsequent requests. Thanks so much!

kuzey beytar · Accepted Answer · 2025-03-17 08:03:45Z

SameSite is not always the issue. I spent two days trying to figure out that my issue was that I had omitted credentials instead of using credentials: 'include'.

If you want to change your cookies, you’ll always need to include your credentials.

I still can’t believe I made that mistake, but I think it’s worth mentioning in a new answer in case someone else has a similar issue.

Collectives™ on Stack Overflow

React/Express set-cookie not working across different subdomains

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related