Faire un appel API dans VS Code est un jeu d'enfant, il suffit d'installer une extension, et vous n'aurez plus à vous fier à aucun outil externe pour faire le travail.

Pendant le développement, il est courant que vous fassiez des requêtes aux API. Il peut s'agir d'une API externe ou de l'API de votre propre serveur principal.

Vous pouvez utiliser des outils tiers comme Postman pour effectuer vos appels API. Mais une extension VS Code vous permet d'effectuer des appels d'API directement depuis VS Code. Ici, vous apprendrez à effectuer des requêtes API dans VS Code.

L'extension client REST VS Code

Une extension dans VS Code est un plug-in ou un module complémentaire qui améliore les fonctionnalités de l'éditeur Visual Studio Code. Le marché des extensions VS Code propose plusieurs types d'extensions qui peuvent vous aider dans vos tâches de programmation. Il existe une extension pour ajouter la prise en charge de la langue. Il y en a un pour fournir une saisie semi-automatique pour un langage de programmation spécifique, etc. Les extensions facilitent la programmation avec VS Code.

instagram viewer

L'extension REST Client vous permet d'exécuter des requêtes API à partir de VS Code. L'extension inclut l'éditeur d'API REST, une interface visuelle qui vous permet d'interroger les points de terminaison de l'API. Il accepte les en-têtes personnalisés, les paramètres de requête et certains autres paramètres.

Pour installer le Client REST, ouvrez VS Code et cliquez sur le Rallonges languette. Rechercher Client REST et cliquez sur le Installer bouton pour l'ajouter à VS Code.

Sous le Détails, vous trouverez un tutoriel utile sur la façon d'utiliser le client pour faire des requêtes API. Voyons les quatre types de requêtes courants et comment les effectuer à l'aide de l'extension REST Client.

Nous allons utiliser Espace réservé JSON pour démontrer comment effectuer des appels d'API à l'aide de l'extension client REST. Il fournit six ressources communes que vous pouvez lire, modifier, mettre à jour ou supprimer en faisant des requêtes API.

Faire une requête GET à l'aide de l'extension client REST

Commencez par créer un .http fichier pour vos requêtes API. Vous pouvez nommer le fichier mesrequêtes.http.

Ajoutez le code suivant à votre mesrequêtes.http fichier pour récupérer une ressource de l'API JSONPlaceholder ayant 1 comme ID :

OBTENIR https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Pour envoyer la demande, cliquez sur le Envoyer une demande bouton qui apparaît en haut du fichier. Une nouvelle fenêtre s'ouvrira contenant les détails de la réponse.

C'est ainsi que vous faites une requête GET dans VS Code.

Faire une requête POST à ​​l'aide de l'extension client REST

Vous effectuez une requête POST lorsque vous souhaitez publier des données sur le serveur, généralement pour créer une nouvelle ressource.

Pour créer une nouvelle ressource dans l'API JSONPlaceholder, remplacez le code dans votre mesrequêtes.http fichier avec les éléments suivants :

POSTE https://jsonplaceholder.typicode.com/posts HTTP/1.1
Type de contenu: "application/json"
{
 "title": "foo",
 "corps": "barre",
 "ID utilisateur": 1
}

Clique le Envoyer une demande bouton pour envoyer la demande. Encore une fois, cela ouvrira une nouvelle fenêtre contenant les données de réponse. La réponse montre une HTTP/1.1 201 Créé message et l'ID de la publication ainsi que d'autres données si l'appel d'API réussit.

{
 "id": "101"
}

Faire une requête PUT à l'aide de l'extension client REST

Vous effectuez une requête PUT lorsque vous souhaitez mettre à jour des données sur le serveur.

Pour mettre à jour une ressource existante dans l'API JSONPlaceholder, remplacez le code dans votre mesrequêtes.http fichier avec les éléments suivants :

METTRE https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
Type de contenu: "application/json"
{
 "title": "nouveau truc",
 "body": "nouvelle barre",
 "ID utilisateur": 1
}

Après l'envoi de la requête, la ressource sera mise à jour sur le serveur fictif et vous obtiendrez un HTTP/1.1 200 OK message.

Faire une requête PATCH à l'aide de l'extension client REST

Vous effectuez une requête PATCH lorsque vous souhaitez modifier un champ particulier ou une propriété d'une ressource donnée sur le serveur.

Pour mettre à jour uniquement le titre d'une ressource existante dans le serveur fictif, remplacez le code dans votre mesrequêtes.http fichier avec les éléments suivants :

https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1 
Type de contenu: "application/json"
{
 "title": "un autre truc"
}

Après avoir fait la demande, le titre de la ressource sera mis à jour sur le serveur fictif et vous obtiendrez un HTTP/1.1 200 OK message avec les autres données de la ressource.

Faire une requête DELETE à l'aide de l'extension client REST

Vous effectuez une requête DELETE lorsque vous souhaitez supprimer une ressource sur le serveur.

Pour supprimer une ressource existante dans le serveur fictif, remplacez le code dans votre mesrequêtes.http fichier avec les éléments suivants :

SUPPRIMER https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Ici le Type de contenu n'est pas obligatoire, et l'objet de données non plus. Si vous envoyez la demande et supprimez la ressource avec succès, vous devriez obtenir un HTTP/1.1 200 OK réponse avec un objet vide.

Effectuez des appels d'API directement depuis le code VS

Auparavant, vous avez peut-être utilisé des outils tiers tels que Facteur pour faire des requêtes API. Bien que ces outils fonctionnent bien, il faut du temps pour les mettre en place. Par exemple, vous devez avoir un compte chez Postman pour utiliser l'explorateur d'API.

Bien qu'il y ait plusieurs outils de test d'API en ligne, mais avec des extensions telles que le client REST, le test des API est beaucoup plus rapide et facile. Vous pouvez tester n'importe quelle API directement depuis votre éditeur de code VS. Ceci est particulièrement utile si vous développez des API localement et souhaitez tester vos API locales à la volée.

Autres extensions de code VS de test d'API

Rest Client est facile à utiliser. Mais ce n'est pas la seule extension VS Code pour tester les API. Les autres options populaires sont Thunder Client, httpYak et httpBook.

Thunder Client fournit un éditeur d'API visuel pour simplifier les demandes d'API. Bien sûr, vous devez savoir ce qu'est l'API REST pour utiliser ces outils.