Question

我正在使用graphql-yoga，并且正在编写访问Microsoft Graph API的cookie。在前端，我有一个安装了NextJS的阿波罗客户端，它在开发中运行良好。当我部署服务器时，根本无法识别前端的cookie。在我的阅读中，我认为这与服务器渲染NextJS有关（即使在我运行下一个构建时，它说的是静态构建...）我确定问题出在这里（我将评论保留在其中，以展示我尝试将凭据设置为“包括”的所有地方）

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),
  });
}

其他所有答案都涉及CORS，但是我的GraphQL-Server上设置了CORS：

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'),
    );

有人能指出我正确的方向吗？我看前端的ApolloClient部分是否正确？预先感谢。

Answer 1

这正盯着我，但他们的警告被控制台淹没了。 Cookie必须在Chrome中设置。

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

控制台具有以下链接以提供洞察力：

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

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

这是Chrome的最新变化，我只是意识到有一个区别，因为我在Firefox中随机打开了我的网站，并且可以正常工作。

Express Cookie解析器未在生产环境中创建Cookie

1 个答案: