Comment récupérer les données d'une API via Axios ?
La librairie Axios est une librairie JavaScript permettant d'interagir avec une API. On peut donc effectuer toutes les opérations de base, et cela comprend la récupération des données. Axios utilise les promesses, une fonctionnalité spécifique du langage JavaScript. Il est donc bien nécessaire de comprendre comment elles fonctionnent pour manipuler la librairie.
Les promesses représentent le résultat d'une fonction asynchrone. Avec la librairie Axios, tous les appels sont ainsi effectués de manière asynchrone. Pour manipuler les données récupérées, vous devez donc attendre que l'appel soit terminé. Il est possible d'exécuter du code après le résultat d'une promesse grâce à la méthode "then". Cette méthode accepte en paramètre une fonction. Vous pouvez donc transmettre à cette fonction la réponse de votre API. L'attribut "data" va contenir les données récupérées.
//Version détaillée de la fonction
function getDonnees() {
// Création d'une promesse qui va contenir l'appel
const promise = axios.get(url)
// Avec la méthode "then", on extrait les données
const donnes = promise.then((reponse) => reponse.data)
// On retourne les données
return donnees
}
//Version abrégée
function getDonnees() {
return axios.get(url).then(reponse => reponse.data)
}
Vous pouvez également utiliser les instructions "async" et "await" pour gérer vos promesses. Utilisez l'instruction "async" pour déclarer votre fonction asynchrone. À l'intérieur du code de la fonction, l'instruction "await" va permettre d'attendre le résultat de l'appel pour ensuite récupérer le résultat.
async function getDonnees() {
const reponse = await axios.get(url)
return reponse.data
}