Bagaimana untuk Memuat naik Gumpalan ke Pelayan Menggunakan jQuery dan FormData?

Memuat Naik Gumpalan Menggunakan JavaScript

Apabila mengendalikan data multimedia dalam aplikasi web, seperti audio atau video, ia sering menjadi perlu untuk memuat naik fail ini ke pelayan jauh. Dalam JavaScript, terdapat berbilang kaedah untuk menyelesaikan tugasan ini.

Satu pendekatan biasa melibatkan penggunaan kaedah $.post() jQuery. Walau bagaimanapun, apabila bekerja dengan Blobs, pengubahsuaian tertentu diperlukan untuk berjaya memuat naik data.

Penyelesaian Menggunakan API FormData

Untuk memuat naik Blob menggunakan jQuery, adalah perlu untuk gunakan API FormData. API ini menyediakan mekanisme untuk membina data borang dan melampirkan data tambahan, seperti Blobs, pada permintaan.

Begini cara anda boleh menggunakan API FormData dengan kaedah $.post() jQuery untuk memuat naik Blob:

<code class="javascript">var fd = new FormData();
fd.append('fname', 'test.wav');
fd.append('data', soundBlob);

$.ajax({
    type: 'POST',
    url: '/upload.php',
    data: fd,
    processData: false,
    contentType: false
}).done(function(data) {
       console.log(data);
});</code>

Dalam kod ini:

1. Objek FormData (fd) dicipta.
2. Kekunci 'fname' dan 'data' ditambahkan pada borang data. 'fname' mewakili nama fail yang dikehendaki pada pelayan, manakala 'data' mengandungi Blob bunyi.
3. Kaedah $.ajax() jQuery digunakan untuk melaksanakan permintaan.
4. ProsesData dan contentType pilihan ditetapkan kepada palsu. Ini penting kerana $.ajax() menukar data borang secara automatik menjadi rentetan pertanyaan, yang tidak sesuai untuk Gumpalan.

Dengan menggunakan API FormData dan mengetepikan gelagat pemprosesan lalai $.ajax (), kod ini berjaya memuat naik Blob ke pelayan.

Atas ialah kandungan terperinci Bagaimana untuk Memuat naik Gumpalan ke Pelayan Menggunakan jQuery dan FormData?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!