Question

我已尝试按照Apollo客户端上的说明发送cookie以及graphql请求，但快递服务器没有收到任何cookie，当我检查请求时，它表明没有cookie与响应一起发送。

点击此页面：

https://www.apollographql.com/docs/react/recipes/authentication.html

我的代码是

const link = createHttpLink({
  uri: 'http://localhost:3000/api/graphql',
  opts: {
    credentials: 'include',
  }
});

const client = new ApolloClient({
  link,
  cache: new InMemoryCache()
});

我的设置非常简单，我只是在localhost：3000上使用create-react-app服务器，将api的请求发送到localhost：5000（表达api服务器）。我可以通过localhost：3000在其他路线上设置和检索cookie，只有Apollo Client不发送它们。

Answer 1

我不明白为什么文档会说明它的作用，尽管具有更多经验的开发人员也许不会有问题。

无论如何，缺乏经验的开发人员应注意，而不是：

const link = createHttpLink({
  uri: 'http://localhost:3000/api/graphql',
  opts: {
    credentials: 'include',
  }
});

应该是：

const httpLink = createHttpLink({
  uri: 'http://localhost:3000/api/graphql',
  credentials: 'same-origin'
});

换句话说，createHttpLink配置对象中没有单独的opts对象。

Answer 2

Apollo客户端库中有一个名为createNetworkInterface的帮助程序，您可以像这样导入它：

import ApolloClient, { createNetworkInterface } from 'apollo-client';

然后您可以像这样实现它：

const networkInterface = createNetworkInterface({
  uri: 
});

Apollo客户端假定您在快速端的graphql客户端正在端点/graphql上侦听。您可以通过转到server.js文件来进行验证。

您应该看到类似的内容：

// Instruct Express to pass on any request made to the '/graphql' route
// to the GraphQL instance.
app.use(
  '/graphql',
  expressGraphQL({
    schema,
    graphiql: true
  })
);

因此，您指定的uri:选项仍然是GraphQL，如下所示：

const networkInterface = createNetworkInterface({
  uri: '/graphql'
});

之所以这样做，是因为每当我们创建自己的networkInterface时，它就不再假设uri是/graphql，因此我们必须直接说出来。

真正重要的部分是opts:属性，如下所示：

const networkInterface = createNetworkInterface({
  uri: '/graphql',
  opts: {
    credentials: 'same-origin'
  }
});

这表示在向后端服务器进行查询时，可以安全地发送cookie。因此，您可以使用此networkInterface并将其传递给Apollo客户端，如下所示：

const networkInterface = createNetworkInterface({
  uri: '/graphql',
  opts: {
    credentials: 'same-origin'
  }
});

const client = new ApolloClient({
  networkInterface,
  dataIdFromObject: o => o.id
});

因此，要使Apollo随同它向后端发出的每个单个请求一起发送cookie，就差不多了。

Answer 3

您的代码应为

const link = createHttpLink({
  uri: 'http://localhost:3000/api/graphql',
  credentials: 'include'
});

const client = new ApolloClient({
  link,
  cache: new InMemoryCache()
});

有关详细信息，请参见官方文档：apollo client cookie

还要确保您的服务器为“ Access-Control-Allow-Origin”标头返回正确的值。它不应该等于'*'

React Apollo客户端不发送cookie

3 个答案: