0

I am using graphql-yoga and I am writing cookies that access the Microsoft Graph API. On the front end I have an apollo client with NextJS set up and it is working perfectly... in development. When I deploy the server there is no recognition of the cookies from the front end at all. In my reading I think this has something to do with NextJS being server rendered (even though when I run next build it says static build...) I am certain the problem is somewhere in here (I am leaving the comments in, to show all of the places I tried to set the credentials to 'include')

export default function createApolloClient(initialState, ctx) {
  // The `ctx` (NextPageContext) will only be present on the server.
  // use it to extract auth headers (ctx.req) or similar.
  return new ApolloClient({
    ssrMode: Boolean(ctx),
    link: new HttpLink({
      fetch,
      uri: process.env.NODE_ENV === 'development' ? endpoint : prodEndpoint,
      credentials: 'include', // Additional fetch() options like `credentials` or `headers`
      fetchOptions: {
        credentials: 'include',
      },
      // request: operation => {
      //   operation.setContext({
      //     fetchOptions: {
      //       credentials: 'include',
      //     },
      //   });
      // },
    }),
    connectToDevTools: true,
    // credentials: 'include',
    cache: new InMemoryCache().restore(initialState),
  });
}

The other answers to this all involved CORS, but I have CORS set up on my my GraphQL-Server:

const opts = {
      debug: process.env.NODE_ENV === 'development',
      cors:
        process.env.NODE_ENV === 'development'
          ? {
              credentials: true,
              origin: ['http://localhost:3000'],
            }
          : {
              credentials: true,
              origin: [
                '...'
              ],
            },
    };
server.start(opts, () =>
      console.log('Playground is running on http://localhost:4000'),
    );

Can anyone point me in the right direction? Am I right to be looking at the ApolloClient portion of my front end? Thanks in advance.

Jordan Rhea
  • 1,186
  • 15
  • 34

1 Answers1

0

This was staring me in the face, but they warnings were being drowned out in the console. Cookies need to be set with in Chrome.

{
  ...,
  sameSite: false,
  secure: true
}

The console had these links to provide insight:

https://www.chromestatus.com/feature/5088147346030592

https://www.chromestatus.com/feature/5633521622188032

This is a very recent change in Chrome, and I only realized that there was a difference because I randomly opened my site in Firefox, and it worked.

Jordan Rhea
  • 1,186
  • 15
  • 34