3

我有一个React应用程序，它周围有一个ErrorBoundary向 Sentry 发送错误的应用程序，它工作正常。我也想将我所有的 GraphQL 查询错误记录到 Sentry 中，但我现在的问题是我的所有 GraphQL 查询，我有一个 catch 块，我在其中为失败的查询调度一个操作。当我删除 catch 块时，错误会记录到 Sentry 中，但我无法触发失败的查询操作。

我现在的解决方案是放入Sentry.captureException()一个非常重复的 GraphQL 查询的每个 catch 块。

ErrorBoundary即使查询有自己的 catch 块，有没有办法允许仍然捕获 GraphQL 错误？

function getEmployee() {
    return function(dispatch) {
        dispatch(requestEmployeeInformation());

        GraphqlClient.query({ query: EmployeeQuery, fetchPolicy: 'network-only' })
            .then((response) => {
                dispatch(receiveEmployeeInformation(response.data));
            })
            .catch((error) => {
                /* temporary solution. This sends error to sentry but is very repetitive because
                   it has to be added to every single action with a graphql query 
                 */
                Sentry.captureException(error)

                //dispatch this action if the query failed
                dispatch(failGetEmployee(error));
            });
    };
}
4

1 回答 1

6

您总是可以在 catch 块内再次抛出错误。但是，处理此问题的最佳方法是使用Error Link。这将允许您记录 GraphQL 错误（作为响应的一部分返回的错误）以及网络错误（失败的请求、无效的查询等）。

import { onError } from '@apollo/link-error'

const link = onError(({ graphQLErrors, networkError, response }) => {
  if (graphQLErrors)
    graphQLErrors.map(({ message, locations, path }) =>
      Sentry.captureMessage(message)
    )
  if (networkError) {
      Sentry.captureException(networkError)
  }

  // Optionally, set response.errors to null to ignore the captured errors
  // at the component level. Omit this if you still want component-specific handling
  response.errors = null
});
于 2020-02-14T03:34:10.693 回答