Requêtes API
Dans le blog d'aujourd'hui, on va parler des requêtes API qu'on peut faire dans React Native. L'importance des requêtes API dans une application mobile est très variable dépendamment du type d'application qu'on développe. Souvent, les requêtes API dans les applications mobiles sont utilisées afin d'obtenir de l'information souhaitée en format JSON, qui va ensuite être traduite dans le format d'objet dans l'environnement de développement conçu par le programmeur.
La façon principale de faire des requêtes API dans React Native est avec la fonction fetch. La manière de l'utiliser peut être aussi facile que :
fetch('https://lienAPI.com/informations');
Par défaut, la fonction fetch faite ainsi va seulement faire une requête GET sans aucun paramètre supplémentaire. Par contre, si la réponse reçue est en JSON, il faut l'indiquer au fetch qu'il recevra une réponse JSON comme suit :
fetch('https://lienAPI.com/informations').
.then(response => response.json());
La partie du then(response => response.json()); indique à la fonction fetch de retourner au format JSON ce que la requête GET a retourné. Ceci semble assez simple à utiliser. Par contre, si l'on souhaite effectuer une requête POST, il faut ajouter des paramètres de plus à la requête comme suit :
fetch('https://lienAPI.com/informations', {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
premierParam: 'Premiere valeur',
deuxiemeParam: 'Deuxième valeur',
}),
});
Comme vous pouvez le constater, la méthode POST semble beaucoup plus longue à développer que celle d'un simple GET. Effectivement, quand on fait une requête POST, il faut ajouter des paramètres d'envoi et bien sûr le contenu à envoyer. Tout cela reste encore assez simple.
La dernière parenthèse que je tiens à ajouter pour les requêtes fetch dans React Native est la notion d'autorisation et de permission. Elle est extrêmement simple à implémenter, il suffit juste d'ajouter une en-tête d'autorisation dans la requête comme cela :
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'Authorization': 'Basic '+btoa('username:password')
}
Conclusion
Le blog d'aujourd'hui a été assez court, mais l'importance des requêtes API dans une application mobile restera toujours haute, donc je trouve qu'il est assez important d'en parler dans le cadre d'apprentissage du développement d'applications React Native. J'espère que cette lecture fut assez plaisante à vous, chers lecteurs.
Références
- Documentation React Native officielle React Native networking
- Documentation React Native sur la fonction fetch NPM react-native-fetch-api
- Documentation sur l'autorisation des reqûetes API StackOverflow
Commentaires