web-dev-qa-db-fra.com

Erreur réseau avec axios et Android

J'ai obtenu une application React-Native fonctionnant avec un backend NodeJS qui sert une API.

Mon front React-Native utilise Expo et Axios pour atteindre un itinéraire de mon API NodeJS (en utilisant Hapi, Joi, Knex), qui mettra à jour (par exemple) ma base de données (MySQL).

Tout fonctionne correctement avec mon simulateur iOS. Cependant, sur Android Emulator, CERTAINS de mes hits sur la route "" ne fonctionnent pas "" avec le message d'erreur suivant: Network Error - node_modules/axios/lib/core/createError.js:16:24 in createError (en fait, cela a fonctionné, mais l'avant ne le détecte pas ...)

C'est étrange, car comme je l'ai dit, c'est UNIQUEMENT pour une partie de mon itinéraire. J'ai changé le http://localhost:8000/api à http://10.0.2.2:8000/api pour être sûr que Android Emulator accède à mon API, et c'est correct pour cette partie.

La route de buggy fonctionne correctement sur iOS et fonctionne correctement sur Insomnia/Postman (localhost:8000/api/sendMail). Il fonctionne sur Android Emulator, mais l'application ne le détecte pas.

Voici un exemple de mon code:

AVANT - En appuyant sur mon bouton "SendEmail": 

/* Button.js */
const sendAndEmailPromise = await sendEmail(this.state.email);

console.log(sendAndEmailPromise); // Output : NOTHING (not undefined, not null, N O T H I N G).

if (sendAndEmailPromise.status === 200) {
    // handle it
} else (sendAndEmailPromise.status === 403) {
    // etc. for each of my codeStatus that can be returned by my API 
}

/* MyAPI.js */
export function sendEmail(mail) {
    return axiosInstance
    .post(`/sendEmail`, null, {
      params: {
        mail
      },
    })
    .then(response => response) // Will not enter here
    .catch(error => {
       console.log(error); // Will output : NETWORK ERROR
    });
}

RETOUR - Voici la promesse sendEmail: 

// Will return true of false :
const isMailSend = await sendTheEmail(mail);
console.log(isMailSend); // Output : TRUE and I receive the email on my gmail, so Android Emulator HIT the route.

if (isMailSend) {
  return handler
    .response({
      data: {
        message: "Email sent.",
      },
    })
    .code(200);
} else {
  // Handle it and return another response
}

Je m'attends à ce que maintenant tout fonctionne bien (ce qui s'est réellement passé ...) et que j'obtienne l'état du code, au lieu d'une "erreur réseau".

De plus, est-il possible avec Axios d'obtenir un autre niveau d'erreur? Quelque chose de plus spécifique.

Un problème GitHub qui n'est pas totalement le même mais semble relier quelque chose d'équivalent: https://github.com/axios/axios/issues/97

Je vous remercie.

react-nativeaxiosreact-native-androidexpo
10
GuillaumeRZ

Vous avez ici deux problèmes:

1) votre émulateur ne fonctionne pas car il ne peut pas résoudre le mot "localhost" en ip. c'est comme utiliser localhost2.com cela ne résoudra pas quelque chose. Cela doit être indiqué sur l'IP locale de votre serveur 192.x.x.x

2) votre serveur doit être lié à 0.0.0.0 car en le liant à localhost, il ne peut pas résoudre les demandes locales comme 192.x.x.x. Si vous corrigez la liaison, votre émulateur aurait la possibilité de voir le serveur et le facteur aussi.

8
Panagiotis Vrs

L'ajout de ces paramètres dans l'en-tête a résolu mon problème

"Content-Type": "application/x-www-form-urlencoded",
  Accept: "application/json"
0
Waleed Arshad