Échec de la requête réseau de React Native fetch()

quand je crée un tout nouveau projet en utilisant react-native init (version RN 0.29.1) et que je mets un fetch dans la méthode de rendu pour la démo publique de L'API de film facebook, il lance un Network Request Failed . Il y a une trace de pile très inutile et je ne peux pas déboguer les requêtes réseau dans la console chrome. Voici le fetch que j'envoie:

fetch('http://facebook.github.io/react-native/movies.json')
      .then((response) => response.json())
      .then((responseJson) => {
        return responseJson.movies;
      })
      .catch((error) => {
        console.error(error);
      });
86
demandé sur David Nathan 2016-07-17 10:42:42

10 réponses

le problème ici est que iOS n'autorise pas les requêtes HTTP par défaut, seulement HTTPS. Si vous voulez activer les requêtes HTTP, ajoutez ceci à votre info.plist :

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>
110
répondu Alek Hurst 2018-06-04 20:05:27

Non recommandé pour autoriser tous les domaines pour http. Faites une exception pour juste les domaines nécessaires.

Source: configuration des Exceptions relatives à la sécurité des transports dans les Applications iOS 9 et OSX 10.11

ajouter ce qui suit à l'info.fichier de votre application:

<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>
50
répondu Lavi Avigdor 2016-07-24 18:46:09

Réagir Natif Docs donne la réponse à cette question.

Apple a bloqué implicitement le chargement de ressources HTTP en clair. Nous devons donc ajouter les informations suivantes sur notre projet.fichier plist (ou équivalent).

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

Réagir Natif Docs -> Intégration Avec Les Applications Existantes -> App De La Sécurité Des Transports

6
répondu Ocean Liu 2017-04-29 04:50:26

le problème peut être dans la configuration du serveur.

Android 7.0 a un bug décrit ici . Contournement proposé par Vicky Chijwani:

Configure votre serveur pour utiliser la courbe elliptique prime256v1. Pour exemple, dans Nginx 1.10 vous faites ceci en définissant ssl_ecdh_curve prime256v1;

4
répondu Dmitry Maksakov 2017-07-24 14:21:51

j'utilisais localhost pour l'adresse, ce qui était évidemment faux. Après le remplaçant par l'adresse IP du serveur (dans le réseau que l'émulateur est), il a parfaitement fonctionné.

Modifier

dans L'émulateur Android, l'adresse de la machine de développement est 10.0.2.2 . Plus d'explications ici

4
répondu Mahmoodvcs 2018-05-26 14:14:01

pour Android, vous avez peut-être oublié d'ajouter la permission dans AndroidManifest.XML Besoin d'ajouter de l'autorisation suivante.

<uses-permission android:name="android.permission.INTERNET" /> 
3
répondu Shashwat 2017-06-06 13:49:10

j'ai le même problème. Dans mon cas, les demandes à localhost fonctionnaient et se sont soudainement arrêtées. Il apparaît que le problème était que j'étais éteindre mon wifi sur mon téléphone android.

1
répondu Ивайло Янков 2018-05-17 16:26:22

juste vous avez des changements dans 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);
     });
0
répondu Lavaraju 2018-03-06 05:04:40

j'avais ce problème pour Android -

URL-localhost / authToken.json-n'a pas fonctionné: (

URL-10.106.105.103 / authToken.json-n'a pas fonctionné: (

URL - http://10.106.105.103/authToken.json - ouvré:): d

Note-utiliser ifconfig sous Linux ou ipconfig sous Windows pour trouver l'adresse IP de la machine

0
répondu Varun Kumar 2018-08-14 13:53:04

exemple:

return fetch('http://<your ip>')
  .then((response) => response.json())
  .then((responseJson) => {
    console.log(responseJson)
  })
  .catch((error) => {
    console.error(error);
  });
-2
répondu Akhila Antony 2018-08-29 05:31:16