Nicht behandelte Fehler Netzwerkfehler: Netzwerkanforderung fehlgeschlagen Fehler: Netzwerkanforderung Fehler fehlgeschlagen: bei neuen ApolloError

Question

I got this error in my application (react-native) when internet connection is lost. When i start the app on offline mode, Initial component renders, try to execute the query, app crashes. it works perfect when my app is connected with internet. But my application crashes when its not. How can i handle this error?

ExceptionsManager.js: 71 „Unbehandelte Fehler Netzwerkfehler: Netzwerkanforderung fehlgeschlagen Fehler: Netzwerkfehler: Netzwerk-Anforderung an neue gescheitert ApolloError“

import ApolloClient, { createNetworkInterface } from 'apollo-client'; 
import { AsyncStorage } from 'react-native'; 
import {SubscriptionClient, addGraphQLSubscriptions} from 'subscriptions-transport-ws'; 

const wsClient = new SubscriptionClient('wss://172.20.32.6:5000', { 
    reconnect: true, 
    connectionParams: { 
    accessToken: 'jka sdhkjashd jkashdjk ashdas' 
    } 
}); 

const networkInterface = createNetworkInterface({ 
    uri: 'http://172.20.32.6:8000/graphql', 
    opts: { 
    credentials: 'same-origin' 
    } 
}); 
const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
    networkInterface, 
    wsClient 
); 
const client = new ApolloClient({ 
    dataIdFromObject: o => o.id, 
    networkInterface: networkInterfaceWithSubscriptions 

}); 
networkInterface.use([{ 
    applyMiddleware(req, next) { 
    if (!req.options.headers) { 
     req.options.headers = {}; // Create the header object if needed. 
    } 
    // get the authentication token from local storage if it exists 
    AsyncStorage.getItem('sessionToken').then((token) => { 
     req.options.headers.Authorization = token ? `${token}` : null; 
     next(); 
    } 
    ); 
    } 
}]); 
export default client; 

Answer 1

dieses sehr hilfreich Fehler zu vermeiden, an der Spitze der Komponente etwas wie folgt hinzufügen Dadurch wird das Ergebnis der Abfrage gerendert.

if (data && data.error) { 
    return (
     <View> 
     <Text>{JSON.stringify(data.error)}</Text> 
     </View> 
    ) 
} 

weitere Informationen mit Fehlern im Umgang können in dieser Github Ausgabe findet https://github.com/apollographql/react-apollo/issues/604