Cookies are being sent but chrome doesn't set them

Issue

I saw many similar questions and played with many combinations but nothing works.
I specify that it’s all on localhost.

    regUser = () => {
    var username = getE("username-input").value;
    var email = getE("email-input").value;
    var password = getE("password-input").value;
    axios({
        url: process.env.REACT_APP_API_URL + "register",
        method: "post",
        data: {
            username, email, password
        },
        withCredentials: true
    }).then(res => {
        if(res.data.regSuccess) {
            // Registration successful
            this.setState({
                regSuccess: true,
                regTextHidden: false,
                regText: "Registration Successful! An e-mail was sent to the specified e-mail address with confirmation information! You will be redirected to the Login page..."
            }, ()=>{
                setTimeout(
                    ()=>{window.location.href=("/login")}, 5000
                    )
            })
        } else {
            this.setState({
                regSuccess: false,
                regTextHidden: false,
                regText: "An error occured. Please try again later!"
            })
        }
    })
}

Backend code:

            f.checkPassword(userData, function(result) {
            if(!result.correct) {
                // Wrong password
                res.send({found: true, correct: false})
                
            } else {
                // Proceed with authentication
                var token = f.genToken(userData.user);
                res.header("OPTIONS", 'true')
                res.cookie("access-token", token.token, {httpOnly: true, sameSite: "none", maxAge: "100000", secure: false});
                res.send({found: true, correct: true})
            }
        })

No matter what cookie settings I use, they are being sent, the "Set-Cookie" header is present but no cookie is set.

The cookie is being sent

Chrome did not set it

I’ve played with every option for like 2 days but it just doesn’t work. Any advice?

Solution

I was stuck on this for a while too. A couple things fixed it for me:

in the frontend in the axios call (which I see you’ve done), use:

withCredentials: true

Then in the backend in express, use npm package cors, with the following:

const app = express();
app.use(cors({ credentials: true, origin: 'http://localhost:3000' }));

Or use whatever your url origin is. Hope this works for you.

Answered By – Harry Riley

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published