Samesite Lax cookie not being set

[ckruszynsky]

When running the login test with ApolloGraphQL; the request works fine. However, the cookie is not being set because the browser is blocking the cookie from being set due to SameSite=Lax.

Can anyone offer any guidance on how to get the cookie to be set. I have configured cors to work with the apollographql query studio:

app.use(
    cors({
      origin: ["http://localhost:3000", "https://studio.apollographql.com"],
      credentials: true,
    })
  );

Here is my session configuration:

app.use(
    session ({
      name: "qid",
      store: new RedisStore({client: redisClient, disableTouch: true}),
      cookie: {
        maxAge: 1000 * 60 * 60 * 24 * 365 * 10, // 10 years
        httpOnly: true,
        secure: __prod__, //cookie only works in https
        sameSite: "lax", // csrf
      },
      secret: "keyboard cat",
      resave: false,
      saveUninitialized: false,
    })
  );

Any help is greatly appreciated.

[vgarmes]

I had the same issue and to make it work I had to set sameSite: 'none' and secure: true.
You will also have to toggle the cookies on in Apollo Studio (click on the gear icon next to the local graphql server url). On the same menu, you will have to add this default header: x-forwarded-proto : https.

The annoying thing is that I have to keep alternating between the cookie settings sameSite: 'none' and sameSite: 'lax' as well as secure: none and secure: __prod__, depending on whether I'm testing the cookies on Apollo Studio or on the frontend respectively. Maybe someone can come up with a better solution...

[brimarq]

This is driving me nuts! I downgraded both [node-]redis and connect-redis to the versions Ben uses, wondering if that might help. Nope. My cookies are being saved in my redis db at the login mutation, along with the userId. The problem I'm having is that a new sessionID is being generated on every req so that the me Query never works. I've just about Googled myself to death, and I have no idea what's causing that. This happens when using both the Apollo Studio and GraphQL Playground v1.8.10. I'm completely stuck.

[vgarmes]

This is driving me nuts! I downgraded both [node-]redis and connect-redis to the versions Ben uses, wondering if that might help. Nope. My cookies are being saved in my redis db at the login mutation, along with the userId. The problem I'm having is that a new sessionID is being generated on every req so that the me Query never works. I've just about Googled myself to death, and I have no idea what's causing that. This happens when using both the Apollo Studio and GraphQL Playground v1.8.10. I'm completely stuck.

Did you check that the cookie is actually saved in the browser? express-session shouldn't be creating a new session on every request if there is already a cookie attached.

[brimarq]

This is driving me nuts! I downgraded both [node-]redis and connect-redis to the versions Ben uses, wondering if that might help. Nope. My cookies are being saved in my redis db at the login mutation, along with the userId. The problem I'm having is that a new sessionID is being generated on every req so that the me Query never works. I've just about Googled myself to death, and I have no idea what's causing that. This happens when using both the Apollo Studio and GraphQL Playground v1.8.10. I'm completely stuck.

Did you check that the cookie is actually saved in the browser? express-session shouldn't be creating a new session on every request if there is already a cookie attached.

Yep. Cookie is saved in the browser.

[brimarq]

Just cloned this repo and created a fresh database to test. Checked out the 6_sessions branch, and I'm having the SAME issue. So, I'm NOT losing my mind. Each req gets a new req.sessionID. Cookie is saved in the GraphQL Playground v1.8.10 browser and session info is saved in Redis along with the added userId parameter with the login mutation. When I run the mequery immediately afterward, a new session is generated with a new req.sessionID and, obviously, no userId parameter. Given that there is no userIdto search for, the me query always returns null.

So... what am I missing? I have "request.credentials": "include", set in GraphQL Playground, what else could it be? Is it a CORS issue?

[vgarmes]

@brimarq If it was a CORS issue, I believe the request would fail before any session is created. Have you tried to run the requests from the frontend instead?

I actually had a lot of issues while testing the cookies because with the latest versions of Apollo, the GraphQL playground is executing from an external site (Apollo Studio) instead of locally, and I needed to use different configurations depending on whether I was doing the requests from my frontend or from Apollo Studio.

Feel free to check out my repo if it's any help, I recently started the project so I'm using the latest versions of most packages.

[brimarq]

@vgarmes Interesting... on a whim, I just tried again with @benawad 's repo, sending my req with Insomnia, and it works! I didn't want to fool with the new Apollo Studio for the reason you mentioned - because it routes requests to an external site; and, I was frustrated with Altair GraphQL Client trying to send credentials find the cookie. So, I opted for the older GraphQL Playground, to at least match what Ben was using. I had used that in the past with no issues; but, now it seems to be buggy. There are other issues with it, too - occasionally, the entire window will lock in place on the screen, and I'll have to restart the application. Not good. Insomnia is such a breath of fresh air - I've used it before with REST; I should have known to just stick with it. I'll be going back to my project to test shortly.

[vgarmes]

@brimarq nice! I will definitely give Insomnia a try, I've heard good stuff about it.

[imolorhe]

@brimarq I'm curious what was the frustration you had with Altair and sending credentials? 🤔

[brimarq]

@brimarq I'm curious what was the frustration you had with Altair and sending credentials? 🤔

Oops... correction... I could send credentials ok, I just couldn't find the cookie. Just checked again this evening and I see it now. I had been looking in the dev tools "Application" tab under Storage -> Cookies, as in Ben's GraphQL Playground example, and it never shows up there. In Altair, the cookie appears in the "Network" tab. In my frustration last night, I completely missed that. Clearly, I should take more frequent breaks. LOL

In Insomnia, the cookie has it's own dedicated tab in the response pane such that you can't miss it.

[Deveshb15]

@brimarq If it was a CORS issue, I believe the request would fail before any session is created. Have you tried to run the requests from the frontend instead?

I actually had a lot of issues while testing the cookies because with the latest versions of Apollo, the GraphQL playground is executing from an external site (Apollo Studio) instead of locally, and I needed to use different configurations depending on whether I was doing the requests from my frontend or from Apollo Studio.

Feel free to check out my repo if it's any help, I recently started the project so I'm using the latest versions of most packages.

I've tried literally everything on this thread and even googled the shit out of myself but this doesn't seem to work, when I run the query I never get the sessions in the application tab, all I get is this

This is my code -> https://github.com/Deveshb15/redemon
can someone help me out over here?

[vgarmes]

@Deveshb15 did you also set Apollo Studio's default headers to x-forwarded-proto : https ?
I stopped using Apollo Studio because I couldn't bother changing the cookie options every time. So now I'm using Postman instead and had no issues so far.

[some-things]

I had the same issue and to make it work I had to set sameSite: 'none' and secure: true. You will also have to toggle the cookies on in Apollo Studio (click on the gear icon next to the local graphql server url). On the same menu, you will have to add this default header: x-forwarded-proto : https.

The annoying thing is that I have to keep alternating between the cookie settings sameSite: 'none' and sameSite: 'lax' as well as secure: none and secure: __prod__, depending on whether I'm testing the cookies on Apollo Studio or on the frontend respectively. Maybe someone can come up with a better solution...

What I did to address this was set the same headers when creating the URQL client in _app.tsx:

const client = createClient({
  url: "http://localhost:4000/graphql",
  fetchOptions: {
    credentials: "include",
    headers: { "X-Forwarded-Proto": "https" },
  },
});

[forgetscode]

@some-things

This worked for me, thank you for sharing.

[deepaktatineni]

I had a similar issue, I was wrongly setting the cookie options in session middleware.
set option

secure: false