JavaScript と jQuery を使用して BLOB オブジェクトをサーバーにアップロードする方法

JavaScript を使用した BLOB のアップロード

この記事では、Chrome のgetUserMedia() と Recorder.js を使用してサーバーに送信します。 JavaScript.

問題:

サウンド データを含む BLOB オブジェクトがありますが、jQuery の post メソッドを使用してサーバーにアップロードする際に支援が必要です。

解決策:

BLOB をアップロードするには、フォームデータ API。 jQuery の post メソッドはフォーム データを必要とするため、このアプローチが必要です。

jQuery 実装:

1. 新しい FormData オブジェクトを作成します。
2. BLOB を追加します。 fd.append('data', soundBlob).
3. jQuery.ajax 設定で processData と contentType を false に設定して、jQuery がフォーム データを自動的に処理しないようにします。これにより、生の BLOB データをアップロードできるようになります。
4. jQuery.ajax を使用して FormData オブジェクトをサーバーに送信します。

サンプル コード:

<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>

次の手順に従うと、JavaScript を使用して BLOB データをサーバーに正常にアップロードでき、 jQuery.

以上がJavaScript と jQuery を使用して BLOB オブジェクトをサーバーにアップロードする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。