Réagir fetch() Native réseau demande a échoué

Question

Quand je crée un nouveau projet à l’aide de (RN version 0.29.1) et mettre une extraction dans la méthode render pour le film de démonstration publique de facebook API, il jette une . Il y a une trace de la pile très inutile et ne peux pas déboguer les requêtes du réseau dans la console de chrome. Voici l’extraction que j’envoie :

Answer 1

Le problème ici est qu’iOS n’autorise pas les requêtes HTTP par défaut, uniquement HTTPS. Si vous souhaitez activer HTTP demandes ajouter ceci à votre `` :

Answer 2

J'ai été en utilisant 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

Pour Genymotion, l'adresse est 10.0.3.2. Plus d'infos ici

Answer 3

Non recommandé d'autoriser tous les domaines pour http. Faites une exception pour seulement les domaines nécessaires.

Source: Configuration des exceptions de sécurité App Transport dans iOS 9 et OSX 10.11

Ajoutez les éléments suivants au fichier info.plist 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>
 

Answer 4

React Native Docs donne la réponse à cela.

Apple a bloqué le chargement implicite des ressources HTTP en texte clair. Nous devons donc ajouter ce qui suit le fichier Info.plist (ou son équivalent) suivant notre projet.

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

React Native Docs -> Intégration avec des applications existantes -> Sécurité du transport d'applications

Answer 5

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

7.0 Android a un bogue décrit ici. Solution proposée par Vicky Chijwani :

Configurer votre serveur pour utiliser le prime256v1 de la courbe elliptique. Par exemple, Nginx 1.10 pour cela réglage ssl_ecdh_curve prime256v1 ;