Aller au contenu
Retour au blog

Connecter React Native à une API HTTPS en production

Déployez le backend de votre application, remplacez localhost par une URL HTTPS publique et gérez authentification, réponses HTTP et erreurs réseau.

  • API React Native
  • backend mobile
  • Android
  • iOS
  • HTTPS

Une application React Native peut appeler une API avec fetch, mais le serveur de développement ne sera pas inclus dans le binaire installé depuis Google Play ou l’App Store. Déployez le backend à une URL publique et configurez la version de production pour l’utiliser.

Utilisez un endpoint HTTPS accessible

Une URL telle que http://localhost:3000/api désigne l’appareil qui effectue la requête. Sur un téléphone, elle pointe vers le téléphone, pas vers l’ordinateur qui exécute Metro. Configurez une adresse de production comme https://api.exemple.fr/v1, puis vérifiez le DNS, TLS et la route depuis un réseau extérieur. Gardez les adresses de l’émulateur et du réseau local dans la configuration de développement.

React Native documente fetch et les différences entre plateformes pour le trafic non chiffré. Utilisez HTTPS en production et n’ajoutez pas d’exceptions HTTP générales pour contourner une erreur de certificat. Consultez le guide réseau React Native.

Gérez les statuts HTTP et les réponses inattendues

Vérifiez response.ok avant de considérer une réponse comme réussie. Distinguez les erreurs réseau des erreurs HTTP et validez les données reçues : un type TypeScript aide l’éditeur, mais ne valide pas le JSON à l’exécution. Prévoyez une annulation ou un délai d’attente et des tentatives limitées si nécessaire. Testez l’expiration de session, les erreurs serveur, les réponses incorrectes et l’absence de réseau sur des versions de production Android et iOS.

Ne placez pas de secrets dans l’application

Une valeur intégrée au build peut être extraite, même si elle vient d’une variable d’environnement. L’URL de l’API peut être publique ; les mots de passe de base, jetons administrateur et identifiants privés doivent rester côté serveur. L’API authentifie chaque requête et autorise chaque action : cacher un bouton ne protège pas une route. Validez les entrées et évitez les jetons dans les logs. La fiche REST Security d’OWASP présente les contrôles serveur utiles.

Les requêtes natives React Native ne suivent pas CORS du navigateur. Un client web distinct y est soumis et peut nécessiter une réponse OPTIONS. Autorisez uniquement les origines web nécessaires.

Où héberger le backend ?

Projects peut convenir à un service Node.js ou conteneur pris en charge et déployé depuis Git ; vérifiez le runtime et les ressources du plan. Un VPS permet de contrôler les paquets système, Docker Compose et les processus, mais vous gérez mises à jour, sécurité et sauvegardes. Le bundle mobile ne démarre pas l’API à lui seul. Consultez le guide backend pour applications mobiles et les détails actuels des offres.

Avant publication, recherchez localhost, 127.0.0.1 et les adresses IP privées dans la configuration de production. Vérifiez l’endpoint HTTPS, les statuts attendus et l’absence d’identifiants privés dans le bundle. Comparez une API personnalisée à Firebase et consultez la checklist Flutter en production.

Avant de commander, comparez où héberger une API : Projects ou VPS selon les besoins de déploiement et de maintenance.

Gérez vos sites, serveurs et e-mails.

Mot de passe oublié ?

C’est gratuit et ça prend une minute.

8 caractères minimum. Ni que des chiffres, ni un mot de passe courant.

Nous vous enverrons un e-mail pour confirmer le compte.