Rest Client Extension för Visual Studio-kod

Senaste uppdateringen okt 17, 2021

Innehåll

Installera Rest Client Extension i Visual Studio-kod

Arbetsflödet för webbutveckling förändras snabbt nuförtiden. Användarna föredrar att bygga webbplatser med JavaScript-ramar / bibliotek som React, Vue, Angular. Medan det är trendigt att bygga en webbplats på dessa teknologier, kräver det också att ringa Rest API för att göra dina applikationer dynamiska.

Din frontend-applikation skickar HTTP-begäran till backend-servern och hämtar eller bearbetar data. Till din backend-server kan du behöva skicka olika HTTP-förfrågningar som GET, POST, PUT, DELETE. Och baserat på dessa HTTP-förfrågningar och svar fungerar din applikation för slutanvändaren.

Eftersom du behöver skapa API-slutpunkter är det uppenbart att du måste testa HTTP-förfrågningar. Det finns flera verktyg tillgängliga som gör att vi kan testa HTTP-begäran och svar. Goda nyheter är att om du använder Visual Studio Code behöver du inte använda eller installera något annat verktyg eller programvara. Du kan testa dina API-samtal i själva kodredigeraren. I den här artikeln visar vi dig hur du använder Rest Client-tillägg i Visual Studio-kod.

Installera Rest Client Extension i Visual Studio-kod

Syftet med den här artikeln är att visa hur användaren kan testa HTTP-begäran och svar inom Visual Studio-koden. Så först måste du installera tillägget "Rest Client".

Klicka på ikonen “Extensions" och skriv “Rest Client” i sökfältet. Välj sökpaketet utvecklat av “Huacho Mao” från sökresultatet och installera det.

Hur man testar HTTP-begäran och svar

I det här avsnittet ser vi hur man skickar en faktisk HTTP-begäran och ser svaret. Om du har dina API-slutpunkter redo kan du använda dem direkt. I vårt fall tar vi för teständamål slutpunkter från REQ | RES.

Skapa en fil med ".http" -tillägget som "api.http". Du kan spara den här filen var som helst. Det här är bara en fil där du kan lagra all din HTTP-begäran för senare användning.

För att skicka en GET-begäran är vår slutpunkt https://reqres.in/api/users?page=2. Så, i api.httpvi kommer att skriva det enligt följande.

GET https://reqres.in/api/users?page=2

Nu om du checkar in i redigeraren kommer du att se raden "Skicka begäran" förberedd för vårt uttalande. Klicka på "Skicka begäran" det träffar en API-slutpunkt och ger dig HTTP-svar i nästa fönster. Se skärmdumpen nedan.

Det är så mycket enklare. Framöver kan du skicka POST-begäran enligt nedan.

POST https://reqres.in/api/users
Content-Type: application/json

{
    "name": "morpheus",
    "job": "leader"
}

Naturligtvis vill du inte skapa en separat fil för varje begäran. För att separera begäran, tryck på enter och skriv “###” och lägg sedan till din nya begäran på en ny rad.

GET https://reqres.in/api/users?page=2

###
POST https://reqres.in/api/users
Content-Type: application/json

{
    "name": "morpheus",
    "job": "leader"
}

På så sätt kan du behålla alla dina HTTP-förfrågningar i en enda fil och enkelt testa den. Inget mer problem med att hitta vår begäran och sedan använda den.

I ett annat exempel kan du behöva skicka token i varje HTTP-begäran. Du kan göra det enligt nedan.

POST https://reqres.in/api/users
Authorization: Bearer YOUR_TOKEN_HERE
Content-Type: application/json

{
  "user_id":5,
    "car_number":"030663",
    "car_reg_id":"217",
    "days": ["Monday", "Wednesday"],
    "booking_time": "07PM - 08PM"
}

Du fick idén, eller hur? På samma sätt kan du skriva dina PUT, DELETE HTTP-förfrågningar. Fortsätt och prova. Du skulle definitivt vilja ha den här tillägget. Vi vill höra dina tankar och förslag i kommentarfältet nedan.

relaterade artiklar

Inspelningskälla: artisansweb.net