阿波罗中未使用 onError 导入

如何解决阿波罗中未使用 onError 导入

我正在尝试使用 Apollo 和 Graphql 处理我的 React Native 和 Expo 应用程序上的错误。 问题是，在我的 apolloServices.js 中，我尝试使用 onError 函数，尽管我尝试使用 apollo-link-error 和 @apollo/client/link/error import 仍然是灰色的。 ApolloClient 中的函数。

反应原生：0.63.2 @阿波罗客户端：3.3.11 Apollo-link-error: 1.1.13

// Apollo resources
import { HttpLink } from 'apollo-link-http';
import { ApolloClient } from '@apollo/client'; // Tried putting onError here
import { onError } from 'apollo-link-error'; // And here
//import { onError } from '@apollo/client/link/error'; // Also here
import {
  InMemoryCache,defaultDataIdFromObject,} from 'apollo-cache-inmemory';
import { setContext } from 'apollo-link-context';

/* Constants */
import { KEY_TOKEN } from '../constants/constants';

/**
 * @name ApolloServices
 * @description
 *   The Apollo Client's instance. App.js uses it to connect to graphql
 * @constant httpLink HttpLink Object. The url to connect the graphql
 * @constant defaultOPtions Object. Default options for connection
 * @constant authLink
 */

const httpLink = new HttpLink({
  uri: 'workingUri.com',});

const defaultOptions = {
  watchQuery: {
    fetchPolicy: 'no-cache',errorPolicy: 'ignore',},query: {
    fetchPolicy: 'no-cache',errorPolicy: 'all',};

//Create link with auth header
const authLink = setContext((_,{ headers }) => {
  // get the authentication token from local storage if it exists
  return AsyncStorage?.getItem(KEY_TOKEN).then((token) => {
    // return the headers to the context so httpLink can read them
    return {
      headers: {
        ...headers,'auth-token': token ? token : '',};
  });
});

export default new ApolloClient({
  /* ON ERROR FUNCTION HERE*/
  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}`);
    }
  },cache: new InMemoryCache(),defaultOptions: defaultOptions,link: authLink.concat(httpLink),request: (operation) => {
    operation.setContext({
      headers: {
        'auth-token': token ? token : '',});
  },});

除此之外，该应用程序运行良好，我想要的只是处理 graphql 和网络错误

解决方法

最好的解决方案是使用这种方法

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

    });

export default new ApolloClient({

    cache: new InMemoryCache(),defaultOptions: defaultOptions,link: errorControl.concat(authLink.concat(httpLink)),headers: {
            authorization: token ? token : '',},});