Wie lade ich einen Blob mit jQuery auf einen Server hoch?

Hochladen eines Blobs in JavaScript

Das Hochladen eines Datenblobs, z. B. mit HTML5-APIs aufgezeichnete Audio- oder Videodaten, auf einen Server ist eine häufige Aufgabe in Webanwendungen. In diesem Artikel wird gezeigt, wie Sie JavaScript, insbesondere jQuery, verwenden, um ein Blob auf einen Server hochzuladen.

jQuery-Datei-Upload-Methode

Die jQuery-post()-Methode, wie sie im bereitgestellten Codeausschnitt verwendet wird, ist nicht zum Hochladen von Binärdaten wie Blobs geeignet. Stattdessen wird für diesen Zweck die FormData-API empfohlen.

Erstellen eines FormData-Objekts

Um FormData zu verwenden, erstellen Sie ein neues FormData-Objekt und hängen Sie die erforderlichen Daten daran an. Hängen Sie im bereitgestellten Beispiel den Dateinamen und die Blob-Daten an das FormData-Objekt an:

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

AJAX-Anfrage mit jQuery

Als nächstes verwenden Sie die $.ajax()-Methode von jQuery, um die zu senden FormData-Objekt als mehrteilige/Formulardatenanforderung. Geben Sie den Anforderungstyp, die URL und die Daten an und setzen Sie „processData“ und „contentType“ auf „false“:

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

Dieser Code sendet die Blob-Daten zusammen mit dem Dateinamen an das serverseitige PHP-Skript unter /upload.php und protokolliert die Antwort.

Das obige ist der detaillierte Inhalt vonWie lade ich einen Blob mit jQuery auf einen Server hoch?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!