Cum să efectuați apeluri API REST din interiorul codului VS

În timpul dezvoltării, este obișnuit să faceți solicitări către API-uri. Acest lucru ar putea fi pentru un API extern sau API-ul propriului server backend.

Puteți folosi instrumente terțe, cum ar fi Postman, pentru a efectua apelurile API. Dar o extensie VS Code vă permite să efectuați apeluri API direct din cadrul VS Code. Aici veți învăța cum să efectuați solicitări API în VS Code.

Extensia client REST VS Code

O extensie în VS Code este un plugin sau un add-on care îmbunătățește funcționalitățile editorului Visual Studio Code. Piața de extensii VS Code oferă mai multe tipuri de extensii care vă pot ajuta cu sarcinile de programare. Există o extensie pentru adăugarea suportului lingvistic. Există unul pentru furnizarea de completare automată pentru un anumit limbaj de programare și așa mai departe. Extensiile facilitează programarea cu VS Code.

Extensia REST Client vă permite să executați solicitări API din VS Code. Extensia include editorul REST API, o interfață vizuală care vă permite să interogați punctele finale API. Acceptă anteturi personalizate, parametri de interogare și alți parametri.

Pentru a instala Client REST, deschideți VS Code și faceți clic pe Extensii fila. Caută Client REST și faceți clic pe Instalare butonul pentru a-l adăuga la VS Code.

Sub Detalii fila, veți găsi un tutorial util despre cum să utilizați clientul pentru a face solicitări API. Să vedem cele patru tipuri comune de solicitări și cum să le facem folosind extensia REST Client.

Vom folosi JSONPlaceholder pentru a demonstra efectuarea apelurilor API folosind extensia REST Client. Acesta oferă șase resurse comune pe care le puteți citi, edita, actualiza sau șterge prin solicitări API.

Efectuarea unei cereri GET folosind extensia client REST

Începeți prin a crea un .http fișier pentru solicitările dvs. API. Puteți denumi fișierul cererile mele.http.

Adăugați următorul cod la dvs cererile mele.http fișier pentru a prelua o resursă din API-ul JSONPlaceholder având 1 ca ID:

OBȚINE https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Pentru a trimite cererea, faceți clic pe Trimite cerere butonul care apare în partea de sus a fișierului. Se va deschide o nouă fereastră care conține detaliile răspunsului.

Acesta este modul în care faceți o solicitare GET în VS Code.

Efectuarea unei cereri POST folosind extensia client REST

Efectuați o solicitare POST atunci când doriți să postați date pe server, de obicei pentru a crea o nouă resursă.

Pentru a crea o resursă nouă în API-ul JSONPlaceholder, înlocuiți codul din dvs cererile mele.http fișier cu următoarele:

POST https://jsonplaceholder.typicode.com/posts HTTP/1.1
Tip de conținut: „application/json”
{
 "title": "foo",
 „corp”: „bar”,
 „userId”: 1
}

Apasă pe Trimite cerere butonul pentru a trimite cererea. Din nou, aceasta va deschide o nouă fereastră care conține datele răspunsului. Răspunsul arată un HTTP/1.1 201 Creat mesajul și ID-ul postării împreună cu alte date dacă apelul API are succes.

{
 "id": "101"
}

Efectuarea unei cereri PUT utilizând extensia client REST

Efectuați o solicitare PUT atunci când doriți să actualizați datele de pe server.

Pentru a actualiza o resursă existentă în API-ul JSONPlaceholder, înlocuiți codul din dvs cererile mele.http fișier cu următoarele:

A PUNE https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
Tip de conținut: „application/json”
{
 "title": "nou prost",
 „body”: „bar nou”,
 „userId”: 1
}

După trimiterea cererii, resursa va fi actualizată pe serverul simulat și veți primi un HTTP/1.1 200 OK mesaj.

Efectuarea unei cereri PATCH folosind extensia client REST

Efectuați o solicitare PATCH atunci când doriți să modificați un anumit câmp sau proprietate a unei anumite resurse de pe server.

Pentru a actualiza doar titlul unei resurse existente pe serverul simulat, înlocuiți codul din dvs cererile mele.http fișier cu următoarele:

https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1 
Tip de conținut: „application/json”
{
 "title": "un alt prost"
}

După ce faceți cererea, titlul resursei va fi actualizat pe serverul simulat și veți primi un HTTP/1.1 200 OK mesajul împreună cu celelalte date ale resursei.

Efectuarea unei cereri DELETE folosind extensia client REST

Efectuați o solicitare DELETE atunci când doriți să ștergeți o resursă de pe server.

Pentru a șterge o resursă existentă pe serverul simulat, înlocuiți codul din dvs cererile mele.http fișier cu următoarele:

ȘTERGE https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Aici Tipul de conținut nu este necesar și nici obiectul de date. Dacă trimiteți cererea și ștergeți cu succes resursa, ar trebui să obțineți un HTTP/1.1 200 OK răspuns cu un obiect gol.

Efectuați apeluri API direct din interiorul codului VS

Anterior, este posibil să fi folosit instrumente terțe, cum ar fi Poștaș să facă cereri API. Deși aceste instrumente fac treaba bine, este nevoie de timp pentru a le configura. De exemplu, trebuie să aveți un cont la Postman pentru a utiliza exploratorul API.

Deși există mai multe instrumente de testare API online, dar cu extensii precum Clientul REST, testarea API-urilor este mult mai rapidă și mai ușoară. Puteți testa orice API chiar din interiorul editorului VS Code. Acest lucru este util mai ales dacă dezvoltați API-uri la nivel local și doriți să testați API-urile locale din mers.

Alte teste API VS extensii de cod

Rest Client este ușor de utilizat. Dar, nu este singura extensie VS Code pentru testarea API-urilor. Alte opțiuni populare sunt Thunder Client, httpYak și httpBook.

Thunder Client oferă un editor vizual API pentru a simplifica solicitările API. Desigur, trebuie să știți ce este API-ul REST pentru a utiliza aceste instrumente.