/
Launch Apollo Studio

Error Link

Handle and inspect errors in your GraphQL network stack.


We recommend reading Apollo Link overview before learning about individual links.

Use the onError link to perform custom logic when a GraphQL or network error occurs. You pass this link a function that's executed if an operation returns one or more errors:

import { onError } from "@apollo/client/link/error";

// Log any GraphQL errors or network error that occurred
const link = onError(({ graphQLErrors, networkError }) => {
  if (graphQLErrors)
    graphQLErrors.map(({ message, locations, path }) =>
      console.log(
        `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
      )
    );
  if (networkError) console.log(`[Network error]: ${networkError}`);
});

The function you provide onError should not return a value unless you want to retry the operation.

Options

The function you provide the onError link is passed an object with the following fields:

Name /
Type
Description
operation

Operation

The details of the GraphQL operation that produced an error.

See type definition

response

ExecutionResult

The (possibly modified) GraphQL result from the server, passed by the next link down the chain (i.e., the link closer to the terminating link).

See type definition

graphQLErrors

ReadonlyArray<GraphQLError>

An array of GraphQL errors that occurred while executing the operation, if any.

See type definition

networkError

Error | ServerError | ServerParseError

A network error that occurred while attempting to execute the operation, if any.

forward

function

A function that calls the next link down the chain. Calling return forward(operation) in your onError callback retries the operation, returning a new observable for the upstream link to subscribe to.

Error categorization

An error is passed as a networkError if a link further down the chain called the error callback on the observable. In most cases, graphQLErrors is the errors field of the result from the last next call.

A networkError can contain additional fields, such as a GraphQL object in the case of a failing HTTP status code. In this situation, graphQLErrors is an alias for networkError.result.errors if the property exists.

Ignoring errors

If you want to conditionally ignore errors, you can set response.errors = null; within the error handler:

onError(({ response, operation }) => {
  if (operation.operationName === "IgnoreErrorsQuery") {
    response.errors = null;
  }
});
Edit on GitHub