在 Apollo 客户端中，如何在成功突变后使用标头进行 refetchQueries？

Question

我在使用 Apollo 客户端时遇到了一些麻烦，想知道是否有人可以帮助我。

如何在成功突变后重新运行我的查询（带有标题），并返回一个不记名令牌？

我发现有一种叫做 refetchQueries 的东西，但它似乎忽略了所有的标头，因此我的不记名令牌也是如此。

假设我的 Login 组件中有以下变化：

<Mutation
  mutation={LOGIN_USER}
  refetchQueries={[{
    query: GET_USER,
  }]}
>
  {(loginUser, { loading, error, data }) => {
    if (data) {
      cookies.set('token', data.loginUser.token)
    }
    return (
      <form...

以及我的 App.js 中的以下 authLink：

const authLink = setContext((_, { headers }) => {
  const token = cookies.get('token')

  return {
    headers: {
      ...headers,
      authorization: token  ? `Bearer ${token}`  : null
    },
  }
})

问题似乎是 authLink 东西在使用 refetchQueries 时不起作用（不发送标头）。 当我刷新浏览器时，我的查询工作正常，因为然后使用 cookie 来获取令牌，但是 refetchQueries 似乎不会发生这种情况...

那么，如何在使用标头中的不记名令牌进行突变后运行我的查询，或者是否有更好的方法来执行此操作？

干杯

Answer 1

我不知道您如何定义查询和更改，但是 refetchQueries 可以采用命名要重新获取的查询的字符串数组。 我发现这可以满足我的需求。 为此，您需要为查询命名。 在 gql 标签内，声明您的查询，如

const GET_USER = gql`
query getUser($id: ID) {
  user(id: $id) {
    name
  }
}
`

然后你只用 ['getUser'] 调用 refetchQueries

关于设置 Apollo 以在每个请求上自动设置授权标头，只需查看文档中的示例

向下滚动到关于中间件的部分