Apollo-link: 링크를 사용하여 오류 잡기

에 만든 2017년 11월 02일 · 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 에 2017년 11월 03일

👍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 에 2017년 11월 03일

👍30 🎉12 ❤1

@somehandle 네, 옵션입니다. 내 사용자 지정 링크의 오류를 처리하려면 어떻게 합니까? next(operation) 반환된 Observable을 다른 Observable로 래핑하는 것이 유일한 방법이라는 것을 알았습니다.

valerybugakov 에 2017년 11월 03일

@valerybugakov 어떤 종류의 오류를 처리하고 싶습니까? 그들은 Graphql 오류가 있다면, 당신은 사용할 수 있습니다 .map 의 결과에 forward(operation) 가 결과로 반환되기 때문에, 당신은 다른 관찰자 주위에 가입 할 필요가없는 경우. 몇 가지 예를 보려면 apollo-link-error 뒤에 있는 코드를 살펴보십시오!

jbaxleyiii 에 2017년 11월 29일

@jbaxleyiii
네트워크 오류를 잡으려면 어떻게 해야 합니까?
400, 잘못된 요청을 가정해 보겠습니다.

coyolero 에 2018년 01월 12일

👍42

vjpr 에 2018년 07월 21일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Apollo-link: 링크를 사용하여 오류 잡기

가장 유용한 댓글

모든 5 댓글

관련 문제