Apollo-link: Fehler mithilfe von Links abfangen

Erstellt am 2. Nov. 2017  ·  5Kommentare  ·  Quelle: apollographql/apollo-link

Die Verwendung dieses Beispiels aus der Dokumentation führt dazu, dass fetch zweimal aufgerufen wird (erste beim Abonnieren und die zweite beim http-Link):

http://apollo-link-docs.netlify.com/docs/link/stateless.html

const reportErrors = (errorCallback) => new ApolloLink((operation, forward) => {
  const observer = forward(operation);
  // errors will be sent to the errorCallback
  observer.subscribe({ error: errorCallback })
  return observer;
});

//...

const createLinks = () =>
  ApolloLink.from([
    reportErrors(console.error),
    httpLink,
  ]);

Es funktioniert wie vorgesehen gemäß der beobachtbaren Spezifikation. Producer fn sollte beim ersten Abonnementaufruf aufgerufen werden. Aber es ist nicht klar, wie Fehler in Kombination mit httpLink richtig behandelt werden sollen?

Ich habe ein wenig in den Quellcode gegraben und es gibt Methoden wie map , reduce usw. aber keiner von ihnen akzeptiert einen Fehlerrückruf.

Hilfreichster Kommentar

@valerybugakov schau mal apollo-error-link

Verfassen Sie dies mit Ihrem httpLink wie folgt:

import { ApolloClient } from 'apollo-client';
import { ApolloLink } from 'apollo-link';
import { createHttpLink } from 'apollo-link-http';
import { onError } from 'apollo-link-error';
import { InMemoryCache } from 'apollo-cache-inmemory';

const errorLink = onError(({ networkError, graphQLErrors }) => {
  if (graphQLErrors) {
    graphQLErrors.map(({ message, locations, path }) =>
      console.log(
        `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
      ),
    );
  }
  if (networkError) console.log(`[Network error]: ${networkError}`);
});

const httpLink = createHttpLink({ ... });

const link = ApolloLink.from([
  ...otherLinksIfNeeded,
  errorLink,
  httpLink,
]);

const client = new ApolloClient({
  link,
  cache: new InMemoryCache(),
  queryDeduplication: true,
});

Alle 5 Kommentare

@valerybugakov schau mal apollo-error-link

Verfassen Sie dies mit Ihrem httpLink wie folgt:

import { ApolloClient } from 'apollo-client';
import { ApolloLink } from 'apollo-link';
import { createHttpLink } from 'apollo-link-http';
import { onError } from 'apollo-link-error';
import { InMemoryCache } from 'apollo-cache-inmemory';

const errorLink = onError(({ networkError, graphQLErrors }) => {
  if (graphQLErrors) {
    graphQLErrors.map(({ message, locations, path }) =>
      console.log(
        `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
      ),
    );
  }
  if (networkError) console.log(`[Network error]: ${networkError}`);
});

const httpLink = createHttpLink({ ... });

const link = ApolloLink.from([
  ...otherLinksIfNeeded,
  errorLink,
  httpLink,
]);

const client = new ApolloClient({
  link,
  cache: new InMemoryCache(),
  queryDeduplication: true,
});

@somehandle ja, es ist eine Option. Was ist, wenn ich Fehler in meinem benutzerdefinierten Link behandeln möchte? Ich fand die einzige Möglichkeit, dies zu tun, indem ich das von next(operation) Observable in ein anderes Observable einpacke.

@valerybugakov welche Art von Fehlern möchten Sie behandeln? Wenn es sich um Graphql-Fehler handelt, können Sie .map für das Ergebnis von forward(operation) da sie als Ergebnis zurückgegeben werden. Wenn nicht, müssen Sie den anderen Beobachter abonnieren. Sehen Sie sich den Code hinter apollo-link-error für einige Beispiele an!

@jbaxleyiii
Was ist, wenn ich einen Netzwerkfehler abfangen möchte?
Sagen wir eine 400, schlechte Anfrage.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen