'Set cookie from express.js via React.js won't set. (CORS is set up, credentials: 'include' is used)

I am trying to set a cookie from my express backend via React frontend. The cookie is included in the response header but won't be set by the browser. I tested with Chromium and with Firefox, but had no luck. However in Postman it is setting the cookie perfectly fine.

I tried all suggestions I found here but none worked for me.

Express cookie options:

exports.COOKIE_OPTIONS = {
    httpOnly: true,
    secure: false,
    signed: true,
    maxAge: eval(process.env.REFRESH_TOKEN_EXPIRY) * 100,
    sameSite: 'Lax'
}

Express cors setup:

const whitelist = process.env.WHITELISTED_DOMAINS

  ? process.env.WHITELISTED_DOMAINS.split(",")

  : []

const corsOptions = {

  origin: function (origin, callback) {

    if (!origin || whitelist.indexOf(origin) !== -1) {

      callback(null, true)

    } else {

      callback(new Error("Not allowed by CORS"))

    }

  },

  credentials: true,

}

app.use(cors(corsOptions))

With WHITELISTED_DOMAINS = http://localhost:3000 in .env

Express response with cookie:

res.cookie("refreshToken", refreshToken, COOKIE_OPTIONS);
res.send({success: true, token});

React how I fetch:

fetch(process.env.REACT_APP_API_ENDPOINT + "users/login", {
      method: "POST",
      credetials: "include",
      headers: {"Content-Type": "application/json"},
      body: JSON.stringify({username, password})
});

Everything else is working fine, e.g. the token in the body can be read.

Edit

I also tried it with following options which I got from this answer:
Cookie Options

exports.COOKIE_OPTIONS = {
    httpOnly: true,
    secure: true,
    signed: true,
    maxAge: eval(process.env.REFRESH_TOKEN_EXPIRY) * 100,
    SameSite: 'none'
}

Response with cookie

res.header('Access-Control-Allow-Credentials', true);
res.header("Access-Control-Allow-Headers", "X-Custom-Header");
res.cookie("refreshToken", newRefreshToken, COOKIE_OPTIONS);
res.send({success: true, token});

But it wouldn't work either. Same result. Set-Cookie is present in the response but won't be stored.

Pictures of the response:
Response

No cookies



Solution 1:[1]

The problem was the sameSite option. Apparently this will handled differently as SameSite. Using SameSite with capital "S" worked perfectly fine.

If someone can elaborate why this happens I would be glad.

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 DomeE__