Apollo GraphQL本地和全局错误处理

时间:2019-03-10 14:21:47

标签: reactjs error-handling graphql apollo react-apollo

我正在使用Apollo与以React编写的Web应用程序中的GraphQL服务器进行交互。我正在尝试在应用程序中实现错误处理,并依靠apollo-link-error来实现。

现在,我需要处理2类错误:

  1. 可以在执行Apollo查询或变异的组件中本地处理的错误,即我需要在其上显示上下文错误信息的无效表单字段
  2. 可以全局处理的错误,例如,通过在页面上的某处显示敬酒通知显示错误详细信息

很明显,一旦在本地处理了错误,我就需要进行全局处理,因为在表单字段和<旁边显示错误消息没有多大意义/ em>通过敬酒消息发生的一般错误。

在尝试实现此功能时,我遇到的第一个绊脚石是全局错误处理逻辑在本地错误处理逻辑之前触发 ,这使我无法在本地拦截错误,然后找到一种防止全局逻辑介入的方法。

我创建了codesandbox示例,该示例以最简单的方式设置了ApolloClient,使用http和错误链接,并使用了react-apollo Query组件来查询资源不存在,从而产生错误。

我正在onError组件的Query回调(因此是本地错误处理)和apollo-link-error处理程序(因此是全局错误处理)中处理错误,并且将错误打印到控制台。

console output

它表明全局错误处理逻辑在局部错误处理之前开始。我需要反过来。

Edit apollo error handling

1 个答案:

答案 0 :(得分:0)

我已经发布了一个名为react-apollo-network-status的库,该库可以正确处理此用例。让我知道它是否对您有用!

通过在操作上设置可以在错误链接中读取的上下文变量来实现局部处理某些错误的选择加入/退出行为。