Toujours un problème avec :
réagir 16.0.0-alpha.6
RN 0.44.3
nœud 8.2.1
npm 5.3.0
CodeX 8.3.3
Simulateur iOS 10.3

Dois-je donc travailler sur la version précédente de ceux-ci ?

Je rencontre cela, et je ne peux pas le supporter....

quelque chose ne va pas avec la dernière version?

Le conditionneur est-il en cours d'exécution ? Vous devriez le voir apparaître lorsque vous exécutez react-native run-android . Vous pouvez également le démarrer tout seul en utilisant react-native start . J'aimerais savoir si le problème ici est que l'emballeur ne démarre pas du tout.

Oui, le conditionneur est en cours d'exécution. Lorsque j'exécute la commande react-native run-android, la fenêtre node js s'ouvre indiquant que le conditionneur s'exécute sur 8081 et "Loading Dependency Graph. Done"
Mais lorsque j'essaie le " localhost:8081/index.android.js " sur le navigateur du système, je vois l'erreur "Ce site ne peut pas être atteint".

Mais lorsque je crée une API nodejs normale et que je la teste sur le navigateur, elle s'ouvre avec succès.

J'ai le même problème. Le simulateur iOS fonctionne bien, d'ailleurs

Chaque fois que j'essaie de faire un nouveau projet dans RN, c'est comme si je me heurtais à un mur de nouveaux bugs à chaque fois.
Prochaine tentative le mois prochain, je suppose...

même problème. quelqu'un le résout ?

Essayez d'exécuter :
adb reverse tcp:8081 tcp:8081
sur votre invite de commande et relancez votre projet après cela.

@ashafizullah : J'ai essayé ça aussi ; mais toujours pas de chance.

Cela se produit également sur mon appareil.

J'ai USB connecté, adb inversé et packager en cours d'exécution.

Lorsque vous ouvrez le lien suivant sur le navigateur de l'appareil, il charge le bundle avec succès :

http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false

Je soupçonne donc qu'il y a quelque chose qui ne va pas dans le code Java lui-même.

y a-t-il une solution à cela? Je suis également coincé ici. Le projet IOS fonctionne parfaitement

J'ai rencontré le même problème, et c'est tout parce que l'application Android n'a pas cette autorisation :

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

Assurez-vous donc que votre code Android est capable d'accéder à l'URL distante de votre application.

j'ai le même problème personne ne peut le résoudre?

Je suis également confronté au même problème, si quelqu'un trouve la solution, merci de la poster. Merci.

j'ai le même problème, je réserve adb tcp: 8081 tcp: 8081 , puis je m'assure du même réseau ordinateur et mobile, et je fais les paramètres de développement IP: 8081, mais je ne peux pas me connecter au serveur de développement, qui a résolu ce problème, merci beaucoup vous

Salut les gens. J'ai utilisé console.dir() dans react-native et j'obtiens ce comportement. Et je pense que c'est normal car console.dir() est une fonction browser.window et aucun navigateur n'a de réaction native. Après avoir supprimé console.dir() - mon application a fonctionné.

Je rencontre le même problème sur Mac, des nouvelles ?

j'ai le même problème dans le test de l'appareil.

Android 4.1.2

Hey. Les gars, qui ont une version Android inférieure à 5.0, avez-vous essayé d'utiliser une connexion Wi-Fi à la place d'une connexion USB ? Mon application démarre normalement sur android 4.3 (Huawei mediapad T1 8.0) après avoir été connectée via wifi

eu ce problème, pour moi, il s'est avéré que c'était le port 8081 qui était utilisé par postgresSQL

J'ai le même problème aujourd'hui.
Android 4.4.2 et 6.

Même problème ici aussi. Se produit à chaque fois que je rouvre mon Mac après une courte période de sommeil. Quelqu'un at-il résolu cela?
adb reverse tcp:8081 tcp:8081 - cela ne semble pas fonctionner pour moi

Mon erreur a été résolue en modifiant les limites inotify .
Ce lien a aidé https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers

pareil ce problème aidez moi

J'ai également le même problème en essayant de l'exécuter à partir de localhost. Cela fonctionne dans le navigateur et sur l'émulateur, mais pas sur l'appareil physique

Même problème ici pour Android, depuis l'appareil et l'émulateur. Impossible de se connecter au conditionneur. Faire le "adb reverse ..." pour le périphérique physique. Fonctionnant également sur un port personnalisé, faites "react-native start --port 8088", puis définissez l' adresse IP : 8088 dans les paramètres de développement de l'application.

QUESTION : Existe-t-il un moyen de détecter les défauts de connectivité entre l'application (sur mon appareil Android) et le conditionneur exécuté sur un PC Windows ?

C'est tout ce que je vois, ce sont les indications d'erreur de type "impossible de se connecter", et ne notez aucun message de journal dans le conditionneur. \

MISE À JOUR : l'exécution de "adb reverse --list" a montré que j'avais deux entrées inversées. Il semble qu'après avoir corrigé cela, les choses ont fonctionné. J'ai toujours une "page blanche", mais je suppose que c'est un autre problème.

Même problème avec Android, iOS fonctionne...

comment cela peut-il arriver
j'ai rencontré le même problème aussi,
mais avant tout fonctionnait bien pour moi
puis j'obtiens une boucle infinie qui rend mon bureau assez lent
j'ai donc décidé de fermer l'émulateur et le groupeur de métro que j'obtiens du démarrage natif de réaction
j'ai essayé ce code ci-dessous mais pas de chance du tout
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Était confronté au même problème et a perdu quelques jours derrière cela. Il s'avère que le port par défaut 8081 a été bloqué sur ma machine. Modifié le port selon les instructions ici https://github.com/facebook/react-native/issues/10715 et maintenant cela fonctionne.

Pouvez-vous essayer d'ouvrir cette URL sur le navigateur Web de l'appareil ?

http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false

@kevinresol , si le gestionnaire de packages indique qu'il a démarré sur le port 8081 et que vous ne pouvez pas y accéder depuis le navigateur, il est fort probable que le port soit bloqué par votre pare-feu. Essayez simplement de changer le port par défaut ou voyez si vous pouvez ouvrir le port.

Comme mentionné dans mon post précédent , je peux accéder au bundle via le navigateur de l'appareil.

J'ai exactement le même problème que @kevinresol. Je peux voir le bundle dans le navigateur, mais l'erreur persiste. Je suis sur un émulateur, mais j'ai quand même essayé adb reverse, mais sans succès.

@bruno02100 si vous êtes sous Windows et que vous accédez via wifi, essayez de désactiver votre pare-feu. Voyez si cela résout le problème.

@jerrykurian Je suis sur Mac exécutant l'émulateur Android. Mon pare-feu est déjà désactivé. C'est vraiment étrange.

Après avoir configuré Debug server host & port for device à 192.168.x.x:8081 dans Dev Settings (Requintez le téléphone, le menu apparaîtra)
C'est du travail pour moi

PS : PAS besoin de créer un bundle manuellement, il se construira automatiquement une fois connecté avec succès

Je pense que tout problème de wifi ou solution de wifi est hors sujet. OP parlait de se connecter à localhost via USB avec adb reverse

J'ai remarqué que cette erreur ne se produit qu'après que l'émulateur est activé pendant un certain temps. Donc, pour l'instant, chaque fois que cette erreur apparaît, je redémarre simplement mon émulateur et j'exécute run-android en mode réactif. C'est vraiment ennuyeux mais je n'ai pas beaucoup de temps pour m'y intéresser donc il faudra le faire.

Je peux me connecter au serveur de développement après la construction via les studios Android, mais si j'actualise le code lorsque je modifie le code, mon appareil ou mon émulateur ne peut pas se connecter au serveur.

Mes dépendances
"réagir": "16.0.0",
"react-native": "0.50.4",

Je peux confirmer que la solution de @xlebenny consistant à définir manuellement l'hôte et le port du serveur de débogage sur l'appareil a fonctionné pour moi sur un projet CRNA fraîchement éjecté.

Étape par étape pour éjecter et exécuter un CRNA sur Android

En terminale :

1. create-react-native-app myApp
2. cd myApp
3. yarn run eject (j'ai utilisé les options par défaut "projet React Native normal")
4. react-native run-android

(maintenant, l'application doit être compilée et installée sur le téléphone)

Au téléphone:

1. lancez l'application (attendez-vous à voir l'écran d'erreur rouge ! - cliquez sur le bouton Ignorer en bas à gauche)
2. Secouez le téléphone et choisissez Dev Settings
3. Choisissez l'hôte et le port du serveur de débogage pour le périphérique et définissez-le sur 192.168.xx: 8081 (faites-en votre IP LAN réelle bien sûr)
4. Redémarrez l'application sur le téléphone et vous devriez voir une barre verte en haut "Chargement depuis 192.168.xx:8081..."
5. Vous devriez également voir une action "Bundling index.js " dans le Metro Bundler (qui s'est ouverte lors de l'exécution react-native run-android )
6. Une fois le bundle terminé, l'application devrait s'exécuter sur votre appareil Android !

Le rechargement en direct (lorsque les fichiers source changent) est toujours possible - il suffit de secouer le téléphone et d'appuyer sur "Activer le rechargement en direct"

@ashafizullah pourriez-vous expliquer comment cette commande a résolu le problème. Merci

@plong0 l'a résolu pour moi !

Comme l'a souligné @ bruno02100 , il semble que cette erreur survienne si l'appareil est ouvert pendant une longue période. La désactivation du démarrage rapide dans le paramètre de l'émulateur l'a résolu pour moi 👍

Tapez adb shell et voyez s'il écoute sur votre serveur local ? configurez l'adresse IP et le port du serveur dans les paramètres de développement. Cela devrait résoudre ce problème.

@plong0 merci pour l'aide mais cela ne m'a pas aidé.
Je ne peux pas exécuter mon application sur un appareil Android à l'aide de MAC.

@ramintagizade - comment vérifier si l'application écoute sur mon serveur local ? quelle est la commande:
adb shell [command] ?

Oui, shell adb et netstat.

basé sur ce http://facebook.github.io/react-native/docs/running-on-device.html

accédez à votre adresse IP locale (ex : http://192.168.43.188:8081/) depuis votre navigateur et assurez-vous qu'elle s'affiche

React Native packager est en cours d'exécution.
Documentation de visite

puis accédez aux paramètres de développement dans votre émulateur :

Pour les utilisateurs de Mac, vous pouvez suivre les étapes ci-dessous,
Étape 1 : lancez « adb reverse tcp:8081 tcp:8081 »
Étape 2 : Appuyez sur "commande m"
Étape 3 : Appuyez sur "Paramètres de développement"
Étape 4 : Appuyez sur "Déboguer l'hôte et le port du serveur pour l'appareil"
Étape 5 : Dans la fenêtre contextuelle, entrez "10.0.2.2:${port_id}" dans la section "port_id", utilisez le port sur lequel vous exécutez votre application.
Étape 6 : exécutez maintenant "react-native run-android"

si vous essayez de déboguer l'application sur votre appareil Android physique via le wifi à l'aide d'une machine Windows, l'appareil peut ne pas être en mesure d'accéder au port de votre PC ou ordinateur portable,
vous devez rendre le port accessible. cela implique deux étapes :

1. Créez d'abord une règle dans le pare-feu. pour ce faire, suivez les étapes suivantes :

```
ouvrir la boîte de dialogue d'exécution
-type wf.msc
-cliquez sur les règles entrantes
-cliquez sur nouvelle règle sur le côté droit
-sélectionnez le port dans le menu contextuel et cliquez sur suivant
-sélectionnez le port tcp et les ports locaux spécifiques et entrez le numéro de port comme 8081 (par défaut)
-autoriser la connexion
-sélectionnez tout dans la section de profil
- donner un nom et une description appropriés
-cliquez sur terminer

1. vous devez rendre votre pc accessible à l'extérieur, pour ce faire suivez les étapes suivantes :
   -ouvrir le réseau et le centre de partage à partir du panneau de configuration
   -changer les paramètres d'adaptation
   -sélectionnez votre réseau wifi
   -clic droit, propriétés
   -cliquez sur l'onglet partage
   -cochez toutes les cases

Vous êtes prêt à partir, essayez maintenant d'exécuter react-native run-android.

J'ai eu un problème similaire, bien que j'ai réalisé plus tard que mon appareil émulé (Android) n'avait pas du tout de connexion Internet (ou réseau). Il n'avait pas du tout de symbole WiFi ou LTE. Redémarrer l'émulateur n'a pas résolu le problème, mais le mettre en mode avion et le désactiver à nouveau l'a résolu. Peut-être un bogue Android général de perdre la connexion réseau dans mon cas.

Nous avons rencontré ce problème, afin de résoudre ce problème, la solution est très simple ci-dessous.

1. Annuler le processus en cours de "react-native run-android" par CTRL + C
   ou CMD + C
2. Fermer la ligne de commande de la fenêtre Metro Bundler qui s'est ouverte
   automatiquement.
3. Exécutez à nouveau la commande, "react-native run-android".

Fondamentalement, cette erreur indique que votre version actuelle a échoué pour des raisons telles qu'un problème de code ou un problème de dépendance.

Cliquez ici pour plus de détails

Je ne sais pas ce qui a causé mon problème avec les émulateurs Android sur macOS. Peut-être configurer de nouveaux AVD Android ou installer diverses mises à jour d'Android Studio ?

Cette commande était suspendue :
watchman watch-del-all

Cela a résolu le problème pour moi:
````
brasser désinstaller watchman
infuser installer le gardien

Et juste pour s'assurer que Watchman ne supprime pas la pendaison

veilleur watch-del-all
````

J'ai pu résoudre ce problème en redémarrant enfin l'émulateur.

Enfin j'ai trouvé mon problème.
Dans mon cas, c'était pour le paramètre proxy de mon émulateur.
Allez simplement dans les paramètres de l'émulateur et ne définissez aucun proxy.

J'espère que cela peut aider

Salut tout le monde,
J'ai trouvé le même problème lors de l'exécution dans l'environnement Windows et de la simulation à l'aide du simulateur Android.
Après avoir fait quelques essais et erreurs, j'ai trouvé la solution ci-dessous:

1>> Changez le port dans "node_modules\react-native\local-cliserverserver.js" par défaut :

process.env.RCT_METRO_PORT || 8081

à

par défaut : process.env.RCT_METRO_PORT || 9088

si le port est bloqué ou délivré à une autre application.
Remarque : Vous pouvez choisir n'importe quel numéro de port, j'ai choisi 9088
2>> Exécutez la commande react-native run-android --port 9088 (Mettez votre numéro de port ici). Ce port doit être envoyé à adb en cours d'exécution, de sorte que le serveur et l'adb soient sur le même port.
3>> Maintenant, dans le simulateur de studio Android, appuyez sur Ctrl + m, pour accéder à " Dev Setting ", puis sélectionnez Debug Server port & host for Device , définissez " localhost:9088 ".
4>> Ouvrez la console développeur dans Chrome en utilisant l'url http://localhost :9088/debugger-ui/

Maintenant, il va commencer à charger les modifications que vous apportez dans votre application.

Profitez du codage maintenant :)

Merci d'avoir posté ça ! Il semble que vous n'utilisiez pas la dernière version de React Native, v0.53.0, publiée en janvier 2018. Pouvez-vous vous assurer que ce problème peut toujours être reproduit dans la dernière version ?

Je vais fermer ceci, mais n'hésitez pas à ouvrir un nouveau problème si vous êtes en mesure de confirmer qu'il s'agit toujours d'un problème dans la v0.53.0 ou une version plus récente.

<sub>Comment contribuer • À quoi s'attendre des mainteneurs</sub>

Oui, j'utilise "react-native": "0.53.0".

Mais ce problème est survenu lorsque j'utilisais un proxy d'entreprise interne. Peut-être que certains ports sont bloqués ou utilisés par l'entreprise. J'ai donc utilisé cette méthode pour résoudre. Et posté ici, afin que d'autres puissent résoudre ce problème.

Même problème sur un appareil réel Android. Version 5.1.1

Ouvrez simplement l'invite de commande et accédez au répertoire du projet, tapez simplement "fil" et appuyez sur Entrée, tout ira bien

@ashafizullah sa solution fonctionne !!!!

Qu'il s'agisse d'un simulateur ou d'un appareil réel, pour Android, procédez simplement comme ci-dessous :

@Alijaaan même problème que j'avais apparemment. Merci!

La seule solution que j'ai trouvée est de supprimer votre émulateur actuel et d'en ajouter un nouveau depuis le studio Android AVD Manager . Tous recommencent à fonctionner.

Merci beaucoup @Alijaaan
Il utilisait le paramètre proxy d'Android Studio.

J'ai décoché "utiliser le paramètre proxy du studio Android" puis je sélectionne "Pas de proxy". Tout va bien maintenant.

Le commentaire de @esutton a résolu mon problème.

BTW watchman est mon logiciel préféré. J'étais toujours heureux de mettre ma journée en pause pendant quelques heures pour traquer des problèmes aléatoires de RN et réaliser que tout ce que j'avais à faire était d'exécuter watchman watch-del-all . Maintenant, même cette commande se bloque et nous devons la réinstaller de temps en temps, je suis un développeur encore plus heureux.

react-native run-android --port 9088 a fonctionné pour moi. Merci @ Louies89

je trouve la soluce
1. désactiver mon antivirus
2fermer mon pare-feu

Je pense que c'est un problème avec les changements récents dans le code, surtout si vous utilisez une bibliothèque tierce comme native-base. ce que j'ai fait, j'ai reculé de quelques pas Ctrl + z , désinstallez l'application de l'émulateur et redémarrez-la. puis react-native run-android , et tout fonctionne ! peut-être que cela a quelque chose à voir avec la mise en cache de l'émulateur

@ pinchez254 est d'accord avec vous. La première course va toujours bien.

Veuillez démarrer le serveur npm en utilisant la commande npm start

Bonjour, je mets l'adresse IP de mon ordinateur dans Dev Setting (192.168.1.103:8081) et crée une règle entrante dans le pare-feu pour accéder au port 8081 tcp, mais j'obtiens cette erreur :
"could not connect to development serve"
AUSSI
lorsque vous tapez dans le navigateur "http://localhost:8081/index.delta?platform=android&dev=true&minify=false" , la construction a commencé et s'est terminée avec succès !

Pour ma course :

1. adb reverse tcp:8081 tcp:8081
2. react-native start --reset-cache
3. react-native run-android

a fait l'affaire

J'ai dû ouvrir deux terminaux.
Première exécution
sudo npm start
Après course
react-native run-ios

1. Assurez-vous que votre ordinateur portable et votre téléphone sont sur le même réseau Wi-Fi.
2. Accédez à votre dossier de projet via le shell. Ensuite, exécutez react-native run-android , react-native start --port=8088
3. Ouvrez votre application React Native sur votre appareil.
4. Ouvrez le menu Développeur intégré à l'application. Appuyez sur [cmd] + [M] ([Ctrl] + [M] pour Windows)]
5. Accédez à Paramètres du développeur → Hôte du serveur de débogage pour l'appareil.
6. Tapez l'adresse IP de votre machine et le port du serveur de développement local (par exemple 192.168.1.100:8088).
7. Revenez au menu Développeur et sélectionnez Recharger JS.

react-native run-android --port=8081 :)

La seule façon que j'ai réussi à résoudre était de rechercher toutes les références au port 8081 et de les changer en 9088 (inutilisé) et de commencer par -- port 9088. A également changé le paramètre Dev en port 9088. Il y avait peu de références au port 8081 par défaut dans node_module/react-native dir. Le port 8081 a été utilisé par la protection antivirus dans mon environnement.

Pour moi, les outils de la plate-forme Android n'étaient pas installés. J'ai donc installé en utilisant la commande suivante.
brew cask installer android-platform-tools

Après cela, l'exécution à partir du studio Android ou de la ligne de commande avec * react-native run android * a fonctionné

Le redémarrage de mon Mac l'a résolu pour moi, je ne sais pas pourquoi

tout d'abord, après m'être assuré que vous êtes dans votre fichier de projet, cette solution m'aide :
react-native start
vous obtiendrez très probablement une erreur avec le code ENOSPC
dans ce cas, utilisez ce code :
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
après cela, vous exécutez à nouveau react-native start et votre erreur ENOSPC devrait très probablement être résolue.
ensuite, exécutez simplement react-native run-android
voilà, ça marche pour moi sous linux avec l'émulateur android d'android studio

J'avais cette erreur,
J'ai trouvé une solution en faisant cela.
J'ai d'abord supprimé tous les modules de nœud.
sudo rm -rf node_modules/
puis j'ai réinstallé les packages npm
npm install

puis j'exécute cette commande pour vérifier que les packages de réaction sont corrects.

react-native start

cela me montre que les packages sont corrects, puis je lance l'androïde avec root

react-native run-android --root

puis j'ai trouvé que cela fonctionnait.

Notez également qu'à partir d'Android 9, les transferts HTTP en texte clair (non HTTPS) sont interdits par défaut. Afin d'activer la connexion au serveur de développement à partir d'un appareil exécutant votre application, ajoutez cet attribut à l'élément application dans le fichier _AndroidManifest.xml_ :

android:usesCleartextTraffic="true"

Plus d'informations sur ce problème Stackoverflow

Vous pouvez tester si votre appareil peut accéder à votre serveur de développement en saisissant des URL dans le navigateur Web natif.

Malheureusement, les outils de développement natifs de réaction avalent la raison de l'erreur, mais cela apparaît si vous essayez d'établir votre propre connexion HTTP à l'intérieur de l'application cible où vous obtiendrez une trace de pile utile.

@delj C'est dommage que les outils de développement natifs de réaction avalent la raison de l'erreur.

Astuce : Utilisez manifestPlaceholders pour empêcher la création d'une version avec android:usesCleartextTraffic= "true"

AndroidManifest.xml
````
android:name= ".MainApplication"

android:usesCleartextTraffic="${isDebug}"
    >

````

android/app/build.gradle

 buildTypes {
 déboguer {
 manifestPlaceholders = [isDebug:true]
 }
 Libération {
 manifestPlaceholders = [isDebug:false]

        minifyEnabled enableProguardInReleaseBuilds
        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        signingConfig signingConfigs.release
    }
}

J'ai eu le même problème et ce qui a fonctionné pour moi sur Windows 10, c'est littéralement d'ouvrir le CMD en tant qu'administrateur.

j'ai toujours ce problème. Pouvons-nous ouvrir cette sauvegarde. C'est complètement ridicule, comment est-ce un tutoriel "Get Started" si vous suivez les étapes à la lettre et qu'il ne démarre pas. J'ai littéralement passé des heures sur ce bug. Facebook doit régler ce problème. Soit leur tutoriel est juste PURE WRONG, soit des cas de dépannage bien connus auxquels ils peuvent être liés.

Voici mes étapes:

1. borne 1: adb inverse tcp:8081 tcp:8081
2. borne 1 : démarrage npm
3. réagir-native run-android

Toujours ce problème. J'ai également essayé d'ajouter la valeur du port lors de l'étape 3, mais cela n'a pas fonctionné non plus. Quelqu'un peut-il aider s'il vous plait.

Je compatis complètement - nous venons de passer une heure à réparer cela aussi.

Cela fonctionne pour le simulateur et je pense que la même approche devrait fonctionner pour votre appareil

Il y a quelques problèmes ici, dont le plus important est le paramètre de texte en clair. Avant de faire quoi que ce soit, mettez à jour votre application avec le dernier SDK Android ou ces paramètres ne fonctionneront pas. Pour tester si vous avez ce problème, collez ce code dans l'une de vos fonctions de rendu les plus élevées. Par exemple <App

fetch('http://jofarnold.com')
  .then(res => res.text())
  .then(d => alert('ok'))
  .catch(e => {
    console.error(String(e));
});

Notez le http et non le https . Oui, mon site n'est pas http. Mais pour l'instant je n'ai aucun regret !

Maintenant essaye

fetch('https://httpbin.org')
  .then(res => res.text())
  .then(d => alert('ok'))
  .catch(e => {
    console.error(String(e));
});

Notez les http s .

Lequel échoue? Si les deux échouent, vous avez d'autres problèmes et je ne peux pas vous aider - mais essayez de voir si ces URL fonctionnent dans Chrome dans votre simulateur pour exclure que le réseau ne fonctionne pas. Si le premier échoue (il donnera une boîte rouge réactive native) mais que le second réussit (il alertera avec ok ), alors vous n'avez pas correctement configuré les paramètres de sécurité Android. Alors faisons ça.

Entrez d'abord ce qui suit dans android/.../AndroidManifest.xml dans la section <application

<manifest
....
<application
... other settings
    android:usesCleartextTraffic="true"  <---------- this
    android:networkSecurityConfig="@xml/network_security_config" <------- and this
  >
   ... etc

Créez ensuite un fichier sur android/...res/xml/network_security_config.xml (vous devrez peut-être ajouter le répertoire xml : le nom du fichier n'a rien de spécial - il doit juste être le même que la référence ci-dessus) comme ceci :

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">jofarnold.com</domain>
    </domain-config>
</network-security-config>

Recompilez en vous assurant de faire react-native start --reset-cache dans un terminal (en notant la réinitialisation du cache) et react-native run-android dans un autre.

Maintenant que vous chargez l'application, vous obtiendrez une fenêtre contextuelle ok. Bon produit! Vous avez réussi à fetch mon site non sécurisé.

Maintenant, nous devons trier réagir natif. Pour moi, le serveur est à 10.0.2.2 et le débogueur à localhost ou quelque chose comme ça (je ne me souviens pas, j'écris ceci de mémoire en partie). De toute façon, ils sont différents et donc ça ne marche pas.

Pour cela, changez le jofarnold.com ci-dessus en localhost puis allez dans le menu des paramètres de l'application (cmd-M sur mac) > Paramètres du développeur. Désactivez "Utiliser JS Deltas" (cela ne fonctionne pas bien) et sous Débogage, définissez l'hôte et le port du serveur sur localhost:8081

Votre fichier de configuration de sécurité devrait ressembler à ceci :

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
    </domain-config>
</network-security-config>

Recompilez, redémarrez react-native start --reset-cache et vous obtiendrez la barre verte en haut de l'application avec le loading... ou quoi que ce soit. Dans le terminal, vous devriez le voir groupé avec Delta, Map, etc.

Vous n'avez pas besoin de faire les trucs adb reverse je pense. C'est fait dans le cadre des scripts RN de toute façon.

Bonne chance!

Mon problème était dû au fait que mon émulateur Android était déconnecté du Wifi et des données. Je viens de les allumer et ça marche. J'espère que cela aide si quelqu'un est confronté au même problème.

Mon problème était dû au fait que mon émulateur Android était déconnecté du Wifi et des données. Je viens de les allumer et ça marche. J'espère que cela aide si quelqu'un est confronté au même problème.

Une chose importante que je devrais ajouter au commentaire de Mateo ; si vous fermez votre MacBook et reprenez sur un autre réseau wifi cela peut faire échouer le "wifi" du simulateur. Vous devez redémarrer le simulateur. Je sais que ce n'est pas un problème pour le simulateur en particulier, mais il a un bon référencement pour ce sujet, alors j'espère que laisser ce commentaire ici aidera quelqu'un d'autre.

résolu en utilisant android 5.0 ou supérieur, j'ai eu une erreur dans android 4..4

résolu en utilisant android 5.0 ou supérieur, j'ai eu une erreur dans android 4..4

je suis d'accord

Si vous utilisez un émulateur Android 9, vous devez ajouter, comme indiqué par @delj , android:usesCleartextTraffic="true" dans votre balise Application dans manifest.xml

Le conditionneur est-il en cours d'exécution ? Vous devriez le voir apparaître lorsque vous exécutez react-native run-android . Vous pouvez également le démarrer tout seul en utilisant react-native start . J'aimerais savoir si le problème ici est que l'emballeur ne démarre pas du tout.

Pourquoi se passe ce problème ?? J'ai un mac avec OS 10.13.6 et avant que le serveur ne démarre automatiquement

Merci @JofBigHealth j'ai fait comme vous l'avez suggéré et cela fonctionne sur l'émulateur et le vrai appareil connecté.
Mais j'ai des problèmes avec l'application lorsque je la télécharge depuis le canal alpha. avez-vous des suggestions pour le déboguer?

@ sheva007 Je ne suis pas sûr de ce que vous entendez par "canal alpha". Pouvez-vous expliquer et inclure plus de détails sur les problèmes que vous rencontrez spécifiquement ?

@JofBigHealth désolé pour les informations manquantes.
MISE À JOUR : ça marche maintenant, j'ai juste dû attendre quelque temps jusqu'à ce que Google Play rende la version de travail mise à jour disponible pour les testeurs. Merci beaucoup :)
mon problème initial était que l'application fonctionnait bien < Android 9 mais elle ne passerait pas d'appel réseau avec Android 9, lorsque j'ai utilisé votre solution, l'application comprenant les appels réseau fonctionne comme prévu.
mais quand je l'ai soumis à Google Play Alpha Channel. il ne passe pas les appels réseau.

l'inversion des ports a fonctionné pour moi
comme suggéré par @ashafizullah

La fermeture d'Android Studio, que j'avais ouvert, a étrangement résolu le problème pour moi. Incertain pourquoi...

MISE À JOUR: pour le simulateur à partir de la mise à niveau vers la version 0.57.7, je n'ai pas trouvé nécessaire de faire le correctif de proxy inverse adb , ni de changer le port dans le menu développeur. Il est par défaut quelque chose comme 10.0.1.1:8080 (devinez de mémoire) et Just Works. J'exécute react-native start ou react-native start --reset-cache (si nécessaire) et je construis à partir d'Android Studio et cela fonctionne très bien. Si vous l'avez défini sur le débogage, vous devez avoir un débogueur en cours d'exécution et vous devrez peut-être reconstruire à partir d'Android Studio car il ne se connecte parfois pas la première fois (en raison de ce que je soupçonne être une condition de concurrence), mais sinon, ça va. N'oubliez pas de définir correctement les paramètres de sécurité dans le manifeste de l'application

L'appareil est une autre affaire.

Avoir le même problème lorsque vous essayez de lancer sur l'appareil. Existe-t-il une solution pour l'appareil?

J'ai le même problème. Aidez-moi, s'il vous plaît.

vous devez ajouter un chemin dans vos variables d'environnement ... chemin "adb" vous pouvez le trouver dans C:Users\user\AppData\Local\Android\Sdk/platformtools

Cela a fonctionné pour moi sur Windows 10 : (Après avoir configuré l'hôte et le port du serveur de débogage..)
J'ai vérifié les paramètres de mon pare-feu (Pare-feu Windows > Autoriser une application ou une fonctionnalité via le pare-feu Windows) et j'ai découvert qu'il existe DEUX applications Node.js, mais que l'une d'entre elles n'est pas autorisée à traverser le pare-feu ! Coché la case et enregistré puis tout a fonctionné comme il se doit!

cette bonne question .. et son travail.!

https://stackoverflow.com/questions/37180714/react-native-could-not-connect-to-development-server-android-app

Si vous utilisez un émulateur Android 9, vous devez ajouter, comme indiqué par @delj , android:usesCleartextTraffic="true" dans votre balise Application dans manifest.xml

conseillé

Même erreur.
windows7 + android studio3.3.2.
Le serveur de nœud est actif et je peux visiter 127.0.0.1 à partir du chrome du simulateur, mais l'application Awesome ne peut pas se connecter au serveur de nœud.
J'ai également ajouté android:usesCleartextTraffic="true" à AndroidManisfesto.xml, mais j'ai toujours l'erreur

@aflext Avez-vous exécuté la commande adb reverse tcp:8081 tcp:8081 dans la case rouge ? Cela fonctionne généralement.

@JofBigHealth En changeant l'URL de 127.0.0.1:8081 à localhost:8081 l'a résolu.

Dans mon cas, la solution était Désactiver/Activer "Déboguer JS à distance"

@ashafizullah : J'ai essayé ça aussi ; mais toujours pas de chance.

@ashafizullah oui, ça ne me travaille pas aussi.

peut-il être possible d'exécuter ce projet via Windows ????

Mon erreur a été résolue en modifiant les limites inotify .
Ce lien a aidé https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers

CELA MARCHE!! MERCI BEAUCOUP!!

Mon erreur a été résolue en modifiant les limites inotify .
Ce lien a aidé https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers

Cela a fonctionné pour moi. Merci mec.

J'ai ajouté android:usesCleartextTraffic="true" à AndroidManifest.xml à la balise <application ... et reconstruit l'application. Après cela, il a commencé à se charger normalement à partir du serveur de développement.

Cela m'arrivait parce que le débogueur était en cours d'exécution et connecté à un autre appareil. Ainsi, le simulateur iOS connecté au débogueur empêchait l'appareil Android de se connecter au conditionneur. L'arrêt du débogage à distance sur le simulateur iOS a permis à l'appareil Android de se connecter, ou vous pouvez également démarrer le débogage à distance sur l'appareil Android.

Cela a fonctionné pour moi sur Windows 10 : (Après avoir configuré l'hôte et le port du serveur de débogage..)
J'ai vérifié les paramètres de mon pare-feu (Pare-feu Windows > Autoriser une application ou une fonctionnalité via le pare-feu Windows) et j'ai découvert qu'il existe DEUX applications Node.js, mais que l'une d'entre elles n'est pas autorisée à traverser le pare-feu ! Coché la case et enregistré puis tout a fonctionné comme il se doit!

C'était aussi mon problème, merci !

J'ai résolu avec :

https://www.youtube.com/watch?v=XhiE0HEiYd4

https://stackoverflow.com/questions/44446523/unable-to-load-script-from-assets-index-android-bundle-on-windows

mais .... lorsque je recharge l'application dans l'émulateur, je plante à nouveau et affiche le message :
IMPOSSIBLE DE SE CONNECTER AU SERVEUR DE DÉVELOPPEMENT

J'ai donc essayé d'ajouter node.js et genymotion player.exe dans le pare-feu et de tout redémarrer (geny, réagir), et ça marche à nouveau...

ctrl + Win cmd ligne de commande ipconfig pour trouver l'adresse ipv4 la mienne est 192.168.0.111, après cela j'ai mis 192.168.0.111:8081 dans

Résolu avec succès !

J'ai ajouté android:usesCleartextTraffic="true" à AndroidManifest.xml à la balise <application ... et reconstruit l'application. Après cela, il a commencé à se charger normalement à partir du serveur de développement.

Cela l'a réparé. Merci beaucoup.

Avoir le même problème uniquement sur un appareil Android réel.
Solution:
1) Ajouter le fichier android/app/src/main/res/xml/network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
    </domain-config>
</network-security-config>

2) Ajouter une ligne à android/app/src/main/AndroidManifest.xml

<application
    ...
    android:networkSecurityConfig="@xml/network_security_config"
    ...
>

Trouvez le remède.
Ce problème m'a aidé à résoudre le problème dans les étapes suivantes.

1. (dans le répertoire du projet) mkdir android/app/src/main/assets
2. bundle réactif --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src /main/res
3. réagir-native run-android

https://stackoverflow.com/questions/44446523/unable-to-load-script-from-assets-index-android-bundle-on-windows

Cela a fonctionné pour moi après avoir exécuté adb reverse tcp:8081 tcp:8081 . Auparavant, il ouvrait la fenêtre du serveur de packages, mais rien ne se passait après le chargement du graphique de dépendance, terminé. message.
Maintenant, tout fonctionne correctement après avoir exécuté la commande mentionnée ci-dessus.

Ceci s'applique à Android 9.0+ selon la configuration de sécurité réseau .
Eh bien, après avoir essayé toutes les solutions possibles que j'ai trouvées sur le Web, j'ai décidé d'enquêter manuellement sur le logcat natif d'Android. Même après avoir ajouté android:usesCleartextTraffic="true" , j'ai trouvé ceci dans le logcat :

06-25 02:32:34.561 32001 32001 E unknown:ReactNative: Caused by: java.net.UnknownServiceException: CLEARTEXT communication to 192.168.29.96 not permitted by network security policy

J'ai donc essayé d'inspecter la source de mon application réactive native. J'ai trouvé que dans la variante debug , il y a déjà une configuration de sécurité réseau qui est définie par des gars réactifs, qui entre en conflit avec la variante main .

Il existe une solution simple à cela.
Aller à <app-src>/android/app/src/debug/res/xml/react_native_config.xml
Ajoutez une nouvelle ligne avec votre propre adresse IP dans leComme:

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
  <domain-config cleartextTrafficPermitted="true">
    <domain includeSubdomains="false">localhost</domain>
    <domain includeSubdomains="false">10.0.2.2</domain>
    <domain includeSubdomains="false">10.0.3.2</domain>
    ***<domain includeSubdomains="false">192.168.29.96</domain>***
  </domain-config>
</network-security-config>

Comme l'adresse IP locale de mon ordinateur (vérifier à partir de ifconfig pour Linux) est 192.168.29.96, j'ai ajouté la ligne ci-dessus dans *

Ensuite, vous devez nettoyer et reconstruire pour Android !

cd <app-src>/android
./gradlew clean
cd <app-src>
react-native run-android

J'espère que cela fonctionne pour vous.

Ce que j'ai fait : (travail sur l'émulateur Android Pie 9)

1. Définissez l'IP et le port sur Debug server host & port for device en cliquant sur Ctrl+M et Dev Setting dans l'émulateur. Assurez-vous de définir l'hôte et le port à l'aide de l'hôte et du port de Bundler (par défaut : localhost:8081 ) et assurez-vous que votre port n'est pas bloqué par un autre processus
2. Exécutez adb reverse tcp:8081 tcp:8081 sur le répertoire du projet d'accueil
3. Ajoutez android:usesCleartextTraffic="true" au nœud <application> dans AndroidManifest.xml
4. Après avoir accompli trois points ci-dessus, redémarrez votre projet

@ Eyesonly88 cela a résolu le problème pour moi - merci.

Pour vous qui rencontrez ce problème spécifiquement lors de la définition de votre targetSdkVersion sur API 28.

Tout ce que vous avez à faire est d'ajouter pour votre fichier network_security_config les lignes suivantes ci-dessous :

    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>

PS : dans mon cas, j'ai plusieurs fichiers network_security_config pour chaque saveur, puisqu'il s'agit d'un problème de débogage, l'ajout de ces lignes au fichier network_security_config dans la saveur de débogage était suffisant.

================================================= =======================

Plus d'informations sur le bug ci-dessous :

Si nous allons à https://developer.android.com/training/articles/security-config.html , nous verrons que ces lignes de code ci-dessus sont la configuration de sécurité par défaut pour Android API 24 à API 27. (Android 7.0 à Android 8.1).
Cela signifie que pour Android 9, API 28, qui est celui auquel j'ai été confronté à l'erreur, la configuration par défaut a changé.
Plus précisément, la configuration par défaut pour Android API 28 est :

    <base-config cleartextTrafficPermitted="false">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>

.
C'est pourquoi l'utilisation de la configuration par défaut pour les anciennes API a fonctionné pour moi.

Une autre chose qui a également fonctionné pour moi au début était de définir targetSdkVersion sur api 27. Si vous ne voulez pas exécuter sur l'API 28, cela pourrait également fonctionner pour vous.

Si vous utilisez un émulateur Android 9, vous devez ajouter, comme indiqué par @delj , android:usesCleartextTraffic="true" dans votre balise Application dans manifest.xml

conseillé

vous m'avez fait gagner du temps. Merci beaucoup.

Les gars, j'ouvre le wifi sur l'émulateur et cela a fonctionné pour moi

ce qui a résolu mon problème était d'utiliser sudo yarn start au lieu de yarn start
J'ai un script dans mon package.json avec

{
...
"scripts":{
"start":"react-native start"
}
....
}

Si vous utilisez un émulateur comme xCode ou Android Studio, vous n'avez pas besoin de définir l'adresse du serveur de développement dans les paramètres avec votre adresse IP. Il se réglera automatiquement. Supprimez-le simplement et relancez l'application. Ça marche pour moi.

Si vous utilisez un émulateur Android 9, vous devez ajouter, comme indiqué par @delj , android:usesCleartextTraffic="true" dans votre balise Application dans manifest.xml

conseillé

Tu as sauvé ma journée

Ce que j'ai fait : (travail sur l'émulateur Android Pie 9)

1. Définissez l'IP et le port sur Debug server host & port for device en cliquant sur Ctrl+M et Dev Setting dans l'émulateur. Assurez-vous de définir l'hôte et le port à l'aide de l'hôte et du port de Bundler (par défaut : localhost:8081 ) et assurez-vous que votre port n'est pas bloqué par un autre processus
2. Exécutez adb reverse tcp:8081 tcp:8081 sur le répertoire du projet d'accueil
3. Ajoutez android:usesCleartextTraffic="true" au nœud <application> dans AndroidManifest.xml
4. Après avoir accompli trois points ci-dessus, redémarrez votre projet

Je peux confirmer que la solution de @rafidamr est la bonne. Mais j'étais dans un environnement d'entreprise où je ne pouvais pas utiliser le port 8081, alors j'ai juste changé Metro Bundler sur un port différent comme ceci :

• adb reverse tcp:8088 tcp:8088
• react-native run-android --port 8088

Et bien sûr, pointé vers le nouveau port dans les paramètres de développement de l'émulateur.

Merci @camposbrunocampos 👏🏼 , j'utilisais target: Android 9.0 avec API level 28 .
Mis à jour network_security_config.xml et maintenant l'émulateur fonctionne bien.

J'ai eu des problèmes à la fois pour le démarrer sur ios et android (essayé sur android studio, sans android studio, avec xcode et sans xcode). J'ai essayé tout ce qui est indiqué ci-dessus.

Donc, ce qui n'a PAS aidé, c'est :

• network_security_config.xml
• adb inverse
• remplacer l'adresse IP par l'IP du serveur.
• etc..

La seule chose que j'avais à faire est de faire un: sudo npm start from react native project directory. Cela ressemble à un problème d'autorisation. (sous mac)

@inspiraluna c'est un problème d'installation de base de npm, vous devriez chown votre répertoire système.

ajoutez android:usesCleartextTraffic= "true" à votre application, dans le manifeste

....
android:usesCleartextTraffic="true"
android:theme="@style/AppTheme">

Ça marche pour moi.

J'ai ajouté android:usesCleartextTraffic="true" à AndroidManifest.xml à la balise <application ... et reconstruit l'application. Après cela, il a commencé à se charger normalement à partir du serveur de développement.

Cela a également résolu le problème pour moi, mais je vais commencer en disant que j'ai essayé ce correctif au départ et que cela n'a pas fonctionné. J'ai dû recommencer à zéro avec de nouveaux émulateurs, tuer et redémarrer abd plusieurs fois, réinstaller Android Studio, mettre à jour Gradle, etc.

@ Eyesonly88 Merci..Ça marche pour moi
J'ai ajouté
android:usesCleartextTraffic= "true" à AndroidManifest.xml

Je cible Android 4.0 malheureusement et quand j'exécute adb reverse tcp:8081 tcp:8081 j'ai une erreur

warn Failed to connect to development server using "adb reverse": Command failed: adb -s 192.168.66.103:5555 reverse tcp:8081 tcp:8081

Voici comment j'ai résolu le problème de ne pas avoir d'outils de développement sur l'émulateur :
Cette réponse SO suggère de vérifier votre fichier MainApplication.java et de supprimer BuildConfig.Debug de la méthode getUseDeveloperSupport , donc cela ressemble à ceci :

        <strong i="11">@Override</strong>
        public boolean getUseDeveloperSupport() {
            // Return true to load JS from the packager.
            // If BuildConfig.DEBUG is false, assets will be loaded from assets folder.
            return true; // BuildConfig.DEBUG;
        }