Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Menambah Parameter Rentetan Pertanyaan untuk MENDAPATKAN Permintaan dengan API Ambil?

Bagaimana untuk Menambah Parameter Rentetan Pertanyaan untuk MENDAPATKAN Permintaan dengan API Ambil?

Patricia Arquette
Patricia Arquetteasal
2024-10-26 06:50:30246semak imbas

How to Append Query String Parameters to GET Requests with Fetch API?

Manipulasi Rentetan Pertanyaan dalam Permintaan GET dengan API Ambil

Dalam pembangunan web moden, API Ambil menawarkan mekanisme berkuasa untuk membuat permintaan HTTP. Satu senario biasa melibatkan penghantaran permintaan GET dengan rentetan pertanyaan. Walau bagaimanapun, semantik untuk menambah parameter rentetan pertanyaan berbeza daripada kaedah jQuery $.ajax() yang popular.

Soalan:

Bagaimanakah rentetan pertanyaan boleh ditambahkan pada DAPATKAN permintaan menggunakan API Ambil? Sebagai contoh, pertimbangkan URL berikut:

http://myapi.com/orders?order_id=1

Jawapan:

API Fetch menyediakan dua kaedah utama untuk menambahkan parameter rentetan pertanyaan: URLSearchParams dan URL.

Menggunakan URLSearchParams:

URLSearchParams membenarkan manipulasi rentetan pertanyaan URL. Ia menawarkan antara muka intuitif untuk menambah, mengalih keluar dan menyoal parameter. Untuk membina rentetan pertanyaan, buat contoh URLSearchParams, tambah parameter yang dikehendaki dan tukarkannya kepada rentetan:

// Using URLSearchParams
var request = new Request({
  url: 'http://myapi.com/orders',
  method: 'GET'
});
var params = new URLSearchParams();
params.append('order_id', 1);
request.url += '?' + params.toString();

Menggunakan URL:

Sebagai alternatif, Kelas URL boleh digunakan untuk memanipulasi URL secara langsung. Ia menyediakan kaedah untuk menambah dan mendapatkan semula parameter:

// Using URL
var request = new Request({
  url: new URL('http://myapi.com/orders'),
  method: 'GET'
});
request.url.searchParams.append('order_id', 1);

Contoh Mendalam:

Pertimbangkan senario berikut: mengambil ulasan daripada siaran tertentu pada API RESTful . Berikut ialah contoh lengkap menggunakan pendekatan URLSearchParams:

// Fetch comments for a specific post using URLSearchParams
async function fetchComments() {
  const postId = 1;
  const url = 'https://jsonplaceholder.typicode.com/comments?' +
    new URLSearchParams({ postId }).toString();
  const response = await fetch(url);
  const comments = await response.json();
  console.log(comments);
}

fetchComments();

Dengan memanfaatkan teknik ini, pembangun boleh menambahkan rentetan pertanyaan dengan berkesan pada permintaan GET yang dibuat dengan API Ambil, membolehkan mereka menghantar parameter tambahan kepada titik akhir sebelah pelayan dan dapatkan semula hasil yang ditapis.

Atas ialah kandungan terperinci Bagaimana untuk Menambah Parameter Rentetan Pertanyaan untuk MENDAPATKAN Permintaan dengan API Ambil?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn