{"id":24186,"date":"2021-05-13T13:47:00","date_gmt":"2021-05-13T10:47:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24186"},"modified":"2021-10-18T02:19:04","modified_gmt":"2021-10-17T23:19:04","slug":"rest-client-extension-pour-visual-studio-code","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/rest-client-extension-pour-visual-studio-code\/","title":{"rendered":"Rest Client Extension pour Visual Studio Code"},"content":{"rendered":"

Le flux de travail du d\u00e9veloppement Web \u00e9volue rapidement de nos jours. Les utilisateurs pr\u00e9f\u00e8rent cr\u00e9er des sites Web \u00e0 l’aide de frameworks\/biblioth\u00e8ques JavaScript comme React, Vue, Angular. Bien que la construction d’un site Web sur ces technologies soit \u00e0 la mode, cela n\u00e9cessite \u00e9galement d’appeler des API Rest pour rendre vos applications dynamiques.<\/p>\n

Votre application frontale envoie la requ\u00eate HTTP au serveur principal et obtient ou traite les donn\u00e9es. \u00c0 votre serveur principal, vous devrez peut-\u00eatre envoyer diff\u00e9rentes requ\u00eates HTTP telles que GET, POST, PUT, DELETE. Et sur la base de ces requ\u00eates et r\u00e9ponses HTTP, votre application fonctionne pour l’utilisateur final.<\/p>\n

Comme vous devez cr\u00e9er des points de terminaison d’API, il est \u00e9vident que vous devez tester les requ\u00eates HTTP. Il existe plusieurs outils disponibles qui nous permettent de tester la requ\u00eate et la r\u00e9ponse HTTP. La bonne nouvelle est que si vous utilisez Visual Studio Code, vous n’avez pas besoin d’utiliser ou d’installer un autre outil ou logiciel. Vous pouvez tester vos appels d’API dans votre \u00e9diteur de code lui-m\u00eame. Dans cet article, nous vous montrons comment utiliser l’extension Rest Client dans Visual Studio Code.<\/p>\n

Installer l’extension Rest Client dans Visual Studio Code<\/h3>\n

Le but de cet article est de vous montrer comment l’utilisateur peut tester la requ\u00eate et la r\u00e9ponse HTTP dans le code Visual Studio. Donc, dans un premier temps, vous devez installer l’extension appel\u00e9e "Rest Client".<\/p>\n

Cliquez sur l’ic\u00f4ne "Extensions" et dans le champ de recherche tapez "Rest Client". Dans le r\u00e9sultat de la recherche, choisissez le package d\u00e9velopp\u00e9 par "Huacho Mao" et installez-le.<\/p>\n

Comment tester la requ\u00eate et la r\u00e9ponse HTTP<\/h3>\n

Dans cette section, nous voyons comment envoyer une requ\u00eate HTTP r\u00e9elle et voir la r\u00e9ponse. Si vos points de terminaison d’API sont pr\u00eats, vous pouvez les appliquer directement. Dans notre cas, \u00e0 des fins de test, nous prenons les points de terminaison de REQ | RES<\/a>.<\/p>\n

Cr\u00e9ez un fichier avec l’extension ".http" comme "api.http". Vous pouvez enregistrer ce fichier n’importe o\u00f9. Il s’agit simplement d’un fichier dans lequel vous pouvez stocker toutes vos requ\u00eates HTTP pour une utilisation ult\u00e9rieure.<\/p>\n

Pour envoyer une requ\u00eate GET, notre point de terminaison est https:\/\/reqres.in\/api\/users?page=2<\/a>. Ainsi, dans le api.http<\/code>nous l’\u00e9crirons comme suit.<\/p>\n

GET https:\/\/reqres.in\/api\/users?page=2\n<\/code><\/pre>\n
Maintenant, si vous v\u00e9rifiez dans l’\u00e9diteur, vous verrez la ligne \u00ab\u00a0Envoyer la demande\u00a0\u00bb ajout\u00e9e \u00e0 notre d\u00e9claration. Cliquez sur \u00ab\u00a0Envoyer la demande\u00a0\u00bb, il atteint un point de terminaison d’API et vous donne une r\u00e9ponse HTTP dans la fen\u00eatre suivante. Voir la capture d’\u00e9cran ci-dessous.<\/p>\n
<\/a><\/p>\n
C’est tellement plus simple. \u00c0 l’avenir, vous pouvez envoyer une demande POST comme ci-dessous.<\/p>\n
POST https:\/\/reqres.in\/api\/users\nContent-Type: application\/json\n\n{\n    \"name\": \"morpheus\",\n    \"job\": \"leader\"\n}\n<\/code><\/pre>\n
Bien s\u00fbr, vous ne voulez pas cr\u00e9er un fichier s\u00e9par\u00e9 pour chaque demande. Pour s\u00e9parer la demande, appuyez sur Entr\u00e9e et tapez "###", puis sur une nouvelle ligne, ajoutez votre nouvelle demande.<\/p>\n
GET https:\/\/reqres.in\/api\/users?page=2\n\n###\nPOST https:\/\/reqres.in\/api\/users\nContent-Type: application\/json\n\n{\n    \"name\": \"morpheus\",\n    \"job\": \"leader\"\n}\n<\/code><\/pre>\n
De cette fa\u00e7on, vous pouvez conserver toutes vos requ\u00eates HTTP dans un seul fichier et le tester facilement. Plus besoin de vous presser pour trouver notre demande et ensuite l’utiliser.<\/p>\n
Dans un autre exemple, vous devrez peut-\u00eatre transmettre le jeton dans chaque requ\u00eate HTTP. Vous pouvez le faire comme indiqu\u00e9 ci-dessous.<\/p>\n
POST https:\/\/reqres.in\/api\/users\nAuthorization: Bearer YOUR_TOKEN_HERE\nContent-Type: application\/json\n\n{\n  \"user_id\":5,\n    \"car_number\":\"030663\",\n    \"car_reg_id\":\"217\",\n    \"days\": [\"Monday\", \"Wednesday\"],\n    \"booking_time\": \"07PM - 08PM\"\n}\n<\/code><\/pre>\n
Vous avez l’id\u00e9e, non? De la m\u00eame mani\u00e8re, vous pouvez \u00e9crire vos requ\u00eates HTTP PUT, DELETE. Vas-y, essaies. Vous aimeriez certainement cette extension. Nous aimerions entendre vos pens\u00e9es et suggestions dans la section commentaires ci-dessous.<\/p>\n
Articles Li\u00e9s<\/h4>\n