如何使用 GQL 从 React 前端的 Apollo 客户端获取错误答案

【问题标题】：How can i get errors out of Apollo client in a React front end using GQL如何使用 GQL 从 React 前端的 Apollo 客户端获取错误
【发布时间】：2021-08-03 20:58:43
【问题描述】：

我有一个使用 Apollo/GQL 的 react 应用程序，通过 redux sagas 调用 GQL 查询/突变

我正在使用以下方法实例化 apolloClient：

import ApolloClient from "apollo-client";

//.....

const apolloClient = new ApolloClient({
    link: httpLink,
    cache: new InMemoryCache(),
    queryDeduplication: false,
    });

我需要

访问 apollo 中的错误数组
运行一些操作，以便我可以使用错误，现在让 jsut 说我需要将错误打印到控制台。

文档有点缺乏（甚至 apollo 文档也提到了许多关于如何执行此操作以及他们需要添加信息的查询）

他们的大部分遍历显示查询是从组件调用的，而不是通过 redux 存储和 async/saga 复杂性。

我如何从 apollo 访问错误数组以及如何回调它并运行带有错误的操作（但是，Hooks 等）？

我需要能够在客户端执行此操作

【问题讨论】：

我相信这里的官方文档可能对您使用 Apollo Link 的 onError 有用：apollographql.com/docs/react/api/link/apollo-link-error

标签： reactjs error-handling apollo apollo-client gql

【解决方案1】：

const errorControl =  onError(({ networkError, graphQLErrors }) => {
  if (graphQLErrors) {
    graphQLErrors.map(({ message, locations, path }) => {
      toast.error("There was an error accessing the database, please try again later");
    });
  }
  if (networkError) {
    toast.error("There was a network error, please try again later");
  }
});

来自一个未经授权的堆栈溢出帖子。

然后在新的 ApolloClient 的实例化中连接你的链接

link: errorControl.concat(httpLink)

【讨论】：