Farih.co.id
Home Programming Cara Membuat Panggilan API REST Dari Dalam Kode VS

Cara Membuat Panggilan API REST Dari Dalam Kode VS

woman working on macbook pro 1

Selama pengembangan, Anda biasanya membuat permintaan ke API. Ini bisa ke beberapa API eksternal atau API server backend Anda sendiri.


Anda dapat menggunakan alat pihak ketiga seperti Postman untuk melakukan panggilan API Anda. Tetapi ekstensi Kode VS memungkinkan Anda melakukan panggilan API langsung dari dalam Kode VS. Di sini, Anda akan mempelajari cara melakukan permintaan API di VS Code.


Ekstensi Klien VS Code REST

Ekstensi dalam VS Code adalah plugin atau add-on yang meningkatkan fungsionalitas editor Visual Studio Code. Pasar ekstensi VS Code menyediakan beberapa jenis ekstensi yang dapat membantu tugas pemrograman Anda. Ada ekstensi untuk menambahkan dukungan bahasa. Ada satu untuk menyediakan pelengkapan otomatis untuk bahasa pemrograman tertentu dan seterusnya. Ekstensi membuatnya lebih mudah untuk memprogram dengan VS Code.

Ekstensi REST Client memungkinkan Anda untuk mengeksekusi permintaan API dari dalam VS Code. Ekstensi menyertakan editor REST API, antarmuka visual yang memungkinkan Anda membuat kueri titik akhir API. Itu menerima tajuk khusus, parameter kueri, dan beberapa parameter lainnya.

Untuk menginstal Klien RESTbuka VS Code dan klik Ekstensi tab. Pencarian untuk Klien REST dan klik Install tombol untuk menambahkannya ke Kode VS.

Gambar ekstensi REST Client dari Visual Studio Code

Di bawah Detail tab, Anda akan menemukan tutorial bermanfaat tentang cara menggunakan klien untuk membuat permintaan API. Mari kita lihat empat jenis permintaan umum dan cara membuatnya menggunakan ekstensi REST Client.

Kami akan menggunakan JSONPlaceholder untuk mendemonstrasikan membuat panggilan API menggunakan ekstensi REST Client. Ini menyediakan enam sumber daya umum yang dapat Anda baca, edit, perbarui, atau hapus dengan membuat permintaan API.

Membuat Permintaan GET Menggunakan Ekstensi Klien REST

Mulailah dengan membuat a .http untuk permintaan API Anda. Anda dapat menamai file tersebut myrequests.http.

Tambahkan kode berikut ke myrequests.http file untuk mengambil sumber daya dari JSONPlaceholder API yang memiliki 1 sebagai ID-nya:

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

Untuk mengirim permintaan, klik Kirim Permintaan tombol yang muncul di bagian atas file. Jendela baru akan terbuka yang berisi detail respons.

membuat permintaan dapatkan api di dalam vs kode

Inilah cara Anda membuat permintaan GET di dalam VS Code.

Membuat Permintaan POST Menggunakan Ekstensi Klien REST

Anda membuat permintaan POST saat ingin mengirim data ke server, biasanya untuk membuat sumber daya baru.

Untuk membuat resource baru di JSONPlaceholder API, ganti kode di myrequests.http berkas dengan berikut ini:

 POST https://jsonplaceholder.typicode.com/posts HTTP/1.1
Content-Type: "application/json"

{
  "title": "foo",
  "body": "bar",
  "userId": 1
}

Klik Kirim Permintaan tombol untuk mengirim permintaan. Sekali lagi, ini akan membuka jendela baru yang berisi data respons. Respon tersebut menunjukkan sebuah HTTP/1.1 201 Dibuat pesan dan ID kiriman beserta data lainnya jika panggilan API berhasil.

 {
  "id": "101"
}

Membuat Permintaan PUT Menggunakan Ekstensi Klien REST

Anda membuat permintaan PUT saat ingin memperbarui data di server.

Untuk memperbarui sumber daya yang ada di API JSONPlaceholder, ganti kode di file myrequests.http berkas dengan berikut ini:

 PUT https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
Content-Type: "application/json"

{
  "title": "new foo",
  "body": "new bar",
  "userId": 1
}

Setelah mengirimkan permintaan, sumber daya akan diperbarui di server tiruan dan Anda akan mendapatkan HTTP/1.1 200 oke pesan.

Membuat Permintaan PATCH Menggunakan Ekstensi Klien REST

Anda membuat permintaan PATCH saat Anda ingin mengubah bidang atau properti tertentu dari sumber daya tertentu di server.

Untuk hanya memperbarui judul sumber daya yang ada di server tiruan, ganti kode di myrequests.http berkas dengan berikut ini:

 https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1 
Content-Type: "application/json"

{
  "title": "another foo"
}

Setelah Anda membuat permintaan, judul sumber daya akan diperbarui di server tiruan dan Anda akan mendapatkan HTTP/1.1 200 oke pesan bersama dengan data lain dari sumber daya.

Membuat Permintaan HAPUS Menggunakan Ekstensi Klien REST

Anda membuat permintaan DELETE saat Anda ingin menghapus sumber daya di server.

Untuk menghapus sumber daya yang ada di server tiruan, ganti kode di Anda myrequests.http berkas dengan berikut ini:

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

Di sini, Jenis konten tidak diperlukan, begitu pula objek datanya. Jika Anda mengirim permintaan dan berhasil menghapus sumber daya, Anda akan mendapatkan HTTP/1.1 200 oke respon dengan objek kosong.

Lakukan Panggilan API Langsung Dari Dalam Kode VS

Sebelumnya, Anda mungkin telah menggunakan alat pihak ketiga seperti Postman untuk membuat permintaan API. Meskipun alat ini berfungsi dengan baik, perlu waktu untuk menyiapkannya. Misalnya, Anda harus memiliki akun di Postman untuk menggunakan API explorer.

Meskipun ada beberapa alat pengujian API online, tetapi dengan ekstensi seperti REST Client, pengujian API jauh lebih cepat dan mudah. Anda dapat menguji API apa pun langsung dari dalam editor VS Code Anda. Ini sangat berguna jika Anda sedang mengembangkan API secara lokal dan ingin menguji API lokal Anda dengan cepat.

Ekstensi Pengujian VS Kode API Lainnya

Rest Client mudah digunakan. Tapi, itu bukan satu-satunya ekstensi Kode VS untuk menguji API. Opsi populer lainnya adalah Thunder Client, httpYak, dan httpBook.

Thunder Client menyediakan editor API visual untuk menyederhanakan permintaan API. Tentu saja, Anda perlu mengetahui apa itu REST API untuk menggunakan alat ini.

Comment
Share:

Leave a Reply

Your email address will not be published. Required fields are marked *

Ad