Apollo-link: Выявление ошибок с помощью ссылок

Созданный на 2 нояб. 2017 · 5Комментарии · Источник: apollographql/apollo-link

Использование этого примера из документации приводит к вызову fetch 2 раза (первый по подписке, а второй по ссылке http):

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,
  ]);

Он работает так, как задумано, в соответствии с наблюдаемой спецификацией. Производитель fn должен вызываться при первом вызове подписки. Но неясно, как правильно обрабатывать ошибки в сочетании с httpLink ?

Я немного покопался в исходном коде, и есть такие методы, как map , reduce т.д., но ни один из них не принимает обратный вызов ошибки.

Источник

valerybugakov

Самый полезный комментарий

@valerybugakov взгляните на ссылку apollo-error-link

Составьте это с помощью httpLink следующим образом:

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

ghost 3 нояб. 2017

👍30 🎉12 ❤1

Все 5 Комментарий

@valerybugakov взгляните на ссылку apollo-error-link

Составьте это с помощью httpLink следующим образом:

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

ghost 3 нояб. 2017

👍30 🎉12 ❤1

@somehandle да, это вариант. Что, если я хочу обработать ошибки в своей пользовательской ссылке? Я обнаружил, что единственный способ сделать это - обернуть Observable, возвращаемый next(operation) в другой Observable.

valerybugakov 3 нояб. 2017

@valerybugakov, какие ошибки вы хотите обрабатывать? Если это ошибки Graphql, вы можете использовать .map для результата forward(operation) поскольку они возвращаются в результате, если нет, вам необходимо подписаться на другого наблюдателя. Взгляните на код apollo-link-error для некоторых примеров!