[SOLVED] Cross-site request with credentials not working

Cross-site request with credentials not working

I have a Nextjs app hosted on Vercel and a Nestjs API hosted on Railway (two different domains), and I am trying to make cross-site requests work. I have set up CORS and am no longer getting blocked by it. However, credentials are not being passed in the request (using axios)

Here is my axios instance used to make the call to the api

export const api = axios.create({
    baseURL: apiBaseURL,
    responseType: "json",
    withCredentials: true,
});

In the backend, I am setting the token cookie

res.setCookie(
            "token",
            this.jwtService.sign({ id: user.id, email: user.email }),
            {
                path: "/",
                secure: true,
                sameSite: "none",
                httpOnly: true,
            }
);

The token cookie is later used to authenticate the user's request and is set when the user authenticates with Google OAuth. The user chooses his account, and is redirected to the /auth/redirect API endpoint (Railway) which then sets the cookie and redirects to the front-end (Vercel)

My CORS configuration

app.enableCors({
    origin: ["http://localhost:3000", "https://my-app.vercel.app"],
    credentials: true,
});

Everytime the Front-end tries to call a protected API endpoint, the cookies are not being sent.

I am using the fastify-adapter for Nestjs.

Solution

As I suspected, the problem wasn't my code but my browser (Brave), which blocks 3rd party cookies in the requests. While using Chrome, I can make authenticated requests.