'Cookies with SameSite=None; Secure=true are not sent in all contexts. Chrome 91

I have a web application hosted at https:/parent.example1.com that embeds a cross domain iframe running on https:/child.example2.com. I control both apps.

I need to perform authentication request from the parent app to the child's domain using axios

const config = {
        headers: {
          Authorization: "Bearer XYZ",
          Accept: "application/json",
        },
        withCredentials: true,
    };

 axios.get("https://child.example2.com/auth", config)
     .then((response) => {
          ...
     })
     .catch((error) => {
        console.error(error);
    });

I'm getting no SameSite nor Secure errors/warnings and here is the Set-Cookie header in the response :

Set-Cookie : userId="Exaat3Na3NEAA3AYRmi6jeciH5dEafX"; Version=1; Max-Age=604800; Expires=Sat, 25-Jun-2021 13:51:54 GMT; Path=/; Secure; HttpOnly; SameSite=None

This cookie is supposed to be associated with the domain child.example2.com but when I refresh the iframe the browser is not sending the cookie for some reason.

It is working perfectly when I disable chrome web-security with --disable-web-security

I'm wondering what am I doing wrong ?



Solution 1:[1]

The response from the server at https://child.example2.com should include this headers :

access-control-allow-credentials: true (this one was missing)
access-control-allow-origin: https:/parent.example1.com (and not * if the header above is set to true)

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