如何使用 jQuery 將 Blob 上傳到伺服器？

在JavaScript 中上傳Blob

將資料blob（例如使用HTML5 API 錄製的音訊或視訊資料）上傳到伺服器是Web 應用程式中的一項常見任務。本文示範如何使用 JavaScript，特別是 jQuery，將 blob 上傳到伺服器。

jQuery 檔案上傳方法

提供的程式碼片段中使用的 jQuery post() 方法，不適合上傳 blob 等二進位資料。相反，建議使用 FormData API 用於此目的。

建立 FormData 物件

要使用 FormData，請建立一個新的 FormData 物件並向其附加必要的資料。在提供的範例中，將檔案名稱和blob 資料附加到FormData 物件：

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

使用jQuery 的AJAX 要求

接下來，使用jQuery 的$.ajax() 方法傳送Data物件作為多部分/表單資料請求。指定請求類型、URL 和數據，並將processData 和contentType 設為false：

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

此程式碼將blob 資料連同檔案名稱傳送至位於/upload.php 的伺服器端PHP 腳本，並記錄回應。

以上是如何使用 jQuery 將 Blob 上傳到伺服器？的詳細內容。更多資訊請關注PHP中文網其他相關文章！