Browser ignoring Set-Cookie

Question

I have frontend running at https://fe-qa.mydomain.com and backend at https://qa.mydomain.com.

In the Chrome Dev Tools under Network, I can see that when frontend calls https://qa.mydomain.com/foo/bar2, the response includes the following header:

set-cookie:
MY-COOKIE-NAME=mycookievalue; Max-Age=604800; Expires=Thu, 06 Feb 2025 08:00:49 GMT; Path=/foo; Secure; HTTPOnly; SameSite=None

I can't see the cookie in Chrome Dev Tools under Application > Cookies. It is also not getting sent in subsequent calls to https://qa.mydomain.com/foo/bar2.

When I call https://qa.mydomain.com/foo/bar1 from Postman, it picks up the cookie and uses it in subsequent calls to https://qa.mydomain.com/foo/bar2.

What is the reason for this?

Answer 1

Solution:

Ensure the frontend is configured to include credentials (cookies) in the request.

Example for fetch:

fetch('https://backend-api.com/endpoint', {
  credentials: 'include'
});

Example for Axios:

axios.get('https://backend-api.com/endpoint', {
  withCredentials: true
});

also ensure this header is set

Set Access-Control-Allow-Credentials: true 

in the backend response.