React. js Журнал всех запросов GraphQL в Sentry - PullRequest
0 голосов
/ 14 февраля 2020

У меня есть приложение React , которое я окружил ErrorBoundary, которое отправляет ошибки в Sentry, и оно отлично работает. Я хотел бы также регистрировать все мои ошибки в запросах GraphQL в Sentry, но теперь моя проблема - для всех моих запросов GraphQL, у меня есть блок catch, где я отправляю действие для неудачного запроса. Когда я удаляю блоки перехвата, ошибки регистрируются в Sentry, но я не могу вызвать неудачное действие запроса.

Мое решение теперь состоит в том, чтобы поместить Sentry.captureException() в каждый блок catch запроса GraphQL, который является очень повторяющимся.

Есть ли способ, позволяющий ErrorBoundary по-прежнему перехватывать ошибки GraphQL, даже если запрос имеет собственный блок catch?

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));
            });
    };
}

1 Ответ

1 голос
/ 14 февраля 2020

Вы всегда можете снова выдать ошибку внутри блока catch. Однако лучший способ справиться с этим - использовать Error Link . Это позволит вам регистрировать как ошибки GraphQL (ошибки, возвращаемые как часть ответа), так и сетевые ошибки (ошибочные запросы, неправильные запросы и т. Д. c.).

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
});
...