React Native fetch() Richiesta di rete non riuscita

Quando creo un nuovo progetto utilizzando react-native init (RN versione 0.29.1) e inserisco il metodo di rendering nell'API del film demo pubblico di Facebook, esso genera uno Network Request Failed. C'è una traccia di stack inutile e non riesco a eseguire il debug delle richieste di rete nella console di Chrome. Ecco il recupero che sto inviando:React Native fetch() Richiesta di rete non riuscita

fetch('http://facebook.github.io/react-native/movies.json') 
     .then((response) => response.json()) 
     .then((responseJson) => { 
     return responseJson.movies; 
     }) 
     .catch((error) => { 
     console.error(error); 
     });

fonte

2016-07-17 Alek Hurst

Non ne sono sicuro. Sto usando il simulatore iOS e ho pensato che usasse la connessione internet del mio computer –

Prova a caricare il simulatore manualmente e apri l'url in safari – FuzzyTree

'http' ->' https' (se possibile) molto probabilmente sistemeremo il tuo problema –

Il problema qui era che iOS non consente le richieste http di default, solo https. Se si desidera abilitare le richieste http, aggiungere questo a info.plist:

<key>NSAppTransportSecurity</key> 
<dict> 
    <key>NSAllowsArbitraryLoads</key> 
    <true/> 
</dict>

fonte

2016-07-18 02:31:00

Questa risposta ha funzionato per me Per gli altri nuovi di React Native, questo file (info.plist) può anche essere modificato tramite xcode: http://stackoverflow.com/a/38219454/1299792 – Marklar

non aggiungere ma sostituire. Il codice è già in info.plist, è necessario sostituire la sezione o si otterrà un errore. – osuthorpe

+14

e per quanto riguarda Android? Sto affrontando lo stesso problema anche in Android. – Kumar

Si consiglia di non consentire tutti i domini per http. Crea un'eccezione solo per i domini necessari.

Fonte: Configuring App Transport Security Exceptions in iOS 9 and OSX 10.11

Aggiungere il seguente al file info.plist della vostra applicazione:

<key>NSAppTransportSecurity</key> 
<dict> 
    <key>NSExceptionDomains</key> 
    <dict> 
    <key>yourserver.com</key> 
    <dict> 
     <!--Include to allow subdomains--> 
     <key>NSIncludesSubdomains</key> 
     <true/> 
     <!--Include to allow HTTP requests--> 
     <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key> 
     <true/> 
     <!--Include to specify minimum TLS version--> 
     <key>NSTemporaryExceptionMinimumTLSVersion</key> 
     <string>TLSv1.1</string> 
    </dict> 
    </dict> 
</dict>

fonte

2016-07-24 18:46:09

e per Android? – arisalexis

Sembra che ci siano più file info.plist in più directory nella mia app React Native. Qualche idea su quale cartella contiene il file corretto da cambiare? – Marklar

@Marklar [your_project_folder_name]/ios/[your_project_folder_name] /Info.plist – Stich

Proprio voi hanno variazioni di Fetch ....

fetch('http://facebook.github.io/react-native/movies.json') 
    .then((response) => response.json()) 
    .then((responseJson) => { 
     /*return responseJson.movies; */ 
     alert("result:"+JSON.stringify(responseJson)) 
     this.setState({ 
      dataSource:this.state.dataSource.cloneWithRows(responseJson) 
     }) 
    }).catch((error) => { 
     console.error(error); 
    });

fonte

2016-10-15 10:07:39 Lavaraju

Reagire Native Docs dà la risposta per questo.

Apple ha bloccato il caricamento di risorse HTTP di testo implicito in chiaro. Quindi dobbiamo aggiungere il seguente file Info.plist (o equivalente) del nostro progetto.

<key>NSExceptionDomains</key> 
<dict> 
    <key>localhost</key> 
    <dict> 
     <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key> 
     <true/> 
    </dict> 
</dict>

React Native Docs -> Integration With Existing Apps -> App Transport Security

fonte

2017-04-29 04:50:26

per Android, si può avere perso il permesso di aggiungere in AndroidManifest.xml bisogno di aggiungere la seguente autorizzazione.

<uses-permission android:name="android.permission.INTERNET" />

fonte

2017-06-06 13:49:10 Shashwat

Il problema potrebbe essere nella configurazione del server.

Android 7.0 ha un errore described here. Soluzione proposta da Vicky Chijwani:

Configurare il server per utilizzare la curva ellittica prime256v1. Per esempio , in Nginx 1.10 lo si fa impostando ssl_ecdh_curve prime256v1;

fonte

2017-07-18 10:08:19

Stavo usando localhost per l'indirizzo, la strega era ovviamente sbagliata. Dopo averlo sostituito con l'indirizzo IP del server (nella rete l'emulatore è), ha funzionato perfettamente.

fonte

2018-02-17 16:42:37 Mahmoodvcs

React Native fetch() Richiesta di rete non riuscita

risposta

Problemi correlati