FormData dan URLSearchParams adalah dua objek JavaScript yang digunakan untuk memanipulasi dan mengirim data dalam permintaan HTTP. Meskipun keduanya digunakan untuk tujuan yang mirip, ada beberapa perbedaan utama antara keduanya:
Format Data yang Dikirim:
FormData digunakan untuk mengirim data dalam format multipart/form-data, yang biasanya digunakan untuk mengunggah file atau mengirim data formulir yang kompleks dengan berbagai jenis data seperti teks, file, dan lainnya. Ini lebih cocok untuk kasus yang kompleks.
URLSearchParams digunakan untuk mengirim data dalam format application/x-www-form-urlencoded, yang biasanya digunakan untuk mengirim data formulir yang lebih sederhana dalam permintaan POST. Data yang dikirimkan dengan format ini diencode menjadi string yang sesuai dengan format URL (parameter query string).
Contoh Penggunaan:
FormData lebih sering digunakan ketika Anda perlu mengunggah file atau mengirim data formulir dengan jenis konten yang beragam (misalnya, teks, file gambar, file PDF).
URLSearchParams lebih sering digunakan ketika Anda perlu mengirim data formulir yang sederhana, seperti data teks biasa dalam bentuk key=value, yang biasanya digunakan untuk operasi CRUD pada sumber daya API.
Contoh penggunaan URLSearchParams:
const params = new URLSearchParams();
params.append('name', 'John');
params.append('email', 'john@example.com');
fetch('https://example.com/api', {
method: 'POST',
body: params, // Menggunakan URLSearchParams sebagai body
})
.then(response => response.json())
.then(data => {
console.log(data);
});
Contoh penggunaan FormData:
const formData = new FormData();
formData.append('file', fileInput.files[0]); // Mengunggah file
formData.append('name', 'John');
fetch('https://example.com/upload', {
method: 'POST',
body: formData, // Menggunakan FormData sebagai body
})
.then(response => response.json())
.then(data => {
console.log(data);
});
Jadi, pemilihan antara FormData dan URLSearchParams tergantung pada jenis data yang Anda kirimkan dalam permintaan Anda dan kebutuhan aplikasi Anda.
0 komentar: