this set cookie header didn't specify a samesite attribute and was defaulted to "samesite=lax". how do I fix it?

Question

I have a cookie error that says

This Set-Cookie header didn't specify a "SameSite" attribute and was defaulted to "SameSite=Lax," and was blocked because it came from a cross-site response which was not the response to a top-level navigation.

But this doesn't work for me because I want to use my development environment with a cookie refresh token on localhost, which is http not https. And the response is in fact not a top-level navigation; actually the site sends a "authenticate" request.

I tried

const cookieOptions = {
            httpOnly: true,
            expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000),
            SameSite: "None",
        };
        response.cookie("refreshToken", token, cookieOptions);

I also tried: secure: false, and SameSite: "none" <= note lowercase.

This thread says "All cookies without a SameSite attribute will be treated as if they had SameSite=Lax specified. In other words, they will be restricted to first-party only (server and client on the same domain). If you need third-party cookies (server and client on different domains), then they must be marked with SameSite=None." So why didn't my code fix the problem?

I also tried

import session from "express-session";
// in middleware
 this.app.use(
            session({
                cookie: {
                    secure: true,
                    maxAge: 86400,
                    sameSite: "none",
                },
                secret,
            }),
        );

Same result.

Here is the code I use to make the authenticate request:

const server = axios.create({
    baseURL: baseURL,
    withCredentials: true,
});

 const response = await server!.post("/auth/authenticate", { ...payload });

edit: You'd think that one of these answers would work. But no:

import cookieSession from "cookie-session";
// server file
       this.app.use(
            cookieSession({
                name: "__session",
                keys: ["key1"],
                maxAge: 7 * 24 * 60 * 60 * 1000,
                secure: true,
                httpOnly: true,
                sameSite: "none",
            }),
        );httpOnly: true,
        sameSite: 'none' // fails
    })
);

edit3: We can see here someone saying: "The version of Express in your package-lock.json file is Express v4.16.3. The "none" value for the sameSite option was added in Express v4.17.0. You can then test and see if the sameSite option works. The option is spelled as sameSite (camelcase) and the value is 'none' (lowercase)." And its the accepted answer!

But my express version is "express": "^4.18.1", so what is going on?

edit4: camelcase s like sameSite: "none" as const, also fails

edit5: I don't understand the comment telling me "this cant work because youre not on https". I went to another project where the set cookie action works as expected. We set a httponly cookie using express and send it to the client. It works and we are on Http. hence I dont understand why "install a https certificate" is the only solution here.

[`SameSite=None`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite#none) cookies must also have the `Secure` attribute and, hence, cannot be set in response to an HTTP request, they need HTTPS. — Heiko Theißen, Jan 16 '23 at 15:56
how can I do this in development on an http localhost if the browser won't let me store the cookie? I could put localhost on https I guess? This thread talks about doing it: https://stackoverflow.com/questions/61665881/how-can-we-store-jwt-token-in-http-only-cookies This blog also talks about doing it https://jasonwatmore.com/post/2020/05/13/node-mongo-api-with-email-sign-up-verification-authentication-forgot-password#accounts-controller-js but neither mention this problem im having — plutownium, Jan 16 '23 at 16:14
Does this help? https://stackoverflow.com/questions/12871565/how-to-create-pem-files-for-https-web-server. You write that "the site sends an authentication request", where is this site if not on localhost? — Heiko Theißen, Jan 16 '23 at 16:17
Regarding your edit5: Is the request in the other project (where it works) perhaps not cross-origin? You write that "the site sends an authentication request", where is this site if not on localhost? — Heiko Theißen, Jan 16 '23 at 16:39
My project lives on localhost right now. The other project also worked on localhost. I was able to succeed by copying the settings from that project. See answer below — plutownium, Jan 16 '23 at 16:57

score 0 · Answer 1 · answered Jan 16 '23 at 16:58

The following settings made the error go away

const cookieOptions = {
            httpOnly: true,
            expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000),
            sameSite: "none" as const,
            secure: true, // this was 'false' before. 'true' works.
        };

this set cookie header didn't specify a samesite attribute and was defaulted to "samesite=lax". how do I fix it?

1 Answers1