如何从 Apollo 客户端的 useQuery 获取响应头

Posted

技术标签:

【中文标题】如何从 Apollo 客户端的 useQuery 获取响应头【英文标题】:How to get response header from useQuery of Apollo Client 【发布时间】:2020-09-02 18:40:36 【问题描述】:

我根本找不到办法做到这一点。有谁知道这是否支持?谢谢。

【问题讨论】:

你为什么需要这个? 用于排除错误。 究竟是什么样的?对于与数据相关的错误,通常error 属性会提供足够的信息...您也可能会遇到网络错误...只需探索此对象 @xadm 后端发送关联 ID 作为响应标头。我需要亲自动手将错误与后端发生的其他事情联系起来。 您可以在错误链接中联系response (apollographql.com/docs/react/data/error-handling/…) 【参考方案1】:

ApolloClient 发出请求的方法以及使用它们的 React Hooks 充当了对实际获取数据方式的抽象。它可能来自通过 HTTP 的远程服务器、来自缓存、来自直接对模式执行请求等。因此,它们不会首先公开有关如何获取数据的任何信息,包括传输- HTTP 标头等特定信息。

如果您需要访问此信息,那么执行此操作的适当位置将位于您要添加到 HttpLink 前面的链接中——可以是现有的链接,例如 ContextLinkErrorLink,或者一些自定义链接您自己滚动。如果您在错误处理上下文中执行此操作,那么 ErrorLink 将是您最好的选择,正如 cmets 中所建议的那样。

HttpLink 将来自服务器的原始响应注入到所有链接使用的上下文对象中(请参阅here)。假设您使用默认的 fetch API 作为 fetcher,此响应将是一个 Response 对象。

所以你可以这样做:

const link = onError(( graphQLErrors, networkError, operation ) => 
  const  response  = operation.getContext();
  const  headers, status  = response;
  
  // do something with the headers
);

【讨论】:

ErrorLink 有什么特别需要我做的吗?发生错误时,error 对象仍然不包含标头, 这里也一样。 operation.getContext() 不包含属性响应。我正在尝试访问响应标头但无法访问。

以上是关于如何从 Apollo 客户端的 useQuery 获取响应头的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 Apollo 客户端 useQuery 钩子防止不必要的重新获取?

Apollo 客户端 fetchMore 来自 useQuery 触发两个网络请求

Apollo 客户端没有读取使用 useQuery 钩子传入的变量

Apollo 客户端 useQuery 在 useMutation 后不更新数据

如何将 React 钩子(useContext、useEffect)与 Apollo 反应钩子(useQuery)结合起来

react native apollo client useQuery invalid hook call error