Was ist ein Blob in Jquery verwendet

Question

Ich stieß auf Blob während der Suche nach einigen Sachen in Jquery. Ich habe darüber gegoogelt, konnte aber nicht genau herausfinden, um was für ein Konzept es sich handelt.

Ich habe diesen Code zum Herunterladen einer PDF-Datei über Ajax gefunden.

$.ajax({ 
    method: 'GET', 
    dataType: 'blob', 
    data: { report_type: report_type, start_date: start_date, end_date: end_date, date_type: date_type }, 
    url: '/reports/generate_pdf.pdf', 
     success: function(data) { 
      var blob=new Blob([data]); 
      var link=document.createElement('a'); 
      link.href=window.URL.createObjectURL(blob); 

      link.download="Report_"+new Date()+".pdf"; 
      link.click(); 
      console.log("pdf printed"); 
     } 
}); 

Dieser Code funktioniert gut, aber Drucken leer pdf ohne den Inhalt entweder statisch oder dynamisch. Aber mit einem seltsamen Verhalten, d. H. Wenn die berechneten dynamischen Daten zu groß sind, erzeugt es mehrere Seiten.

Ich bin nur wollte das Konzept von Blob herauszufinden, so dass ich mir selbst herausfinden kann, was dieses Stück Code tut und wie funktioniert Blob.

Jeder richtige Leitfaden oder Hilfe würde wirklich geschätzt werden.

Vielen Dank im Voraus!

Answer 1

Siehe 5. The Blob Interface and Binary Data

A Blob Objekt in eine Bytefolge bezeichnet und hat ein Attribut size die die Gesamtzahl der Bytes in der Byte-Sequenz ist, und einen type Attribut, das ein ASCII- ist codierte Zeichenfolge in Kleinbuchstaben, die den Medientyp der Bytefolge darstellt.

---

jQuery.ajax() nicht über eine Option dataType-Blob standardmäßig gesetzt, siehe Add support for HTML5 XHR v2 with responseType set to 'arraybuffer' on $.ajax

Sie XMLHttpRequest() verwenden können, oder fetch()response auf Blob oder ArrayBuffer einzustellen.

var request = new XMLHttpRequest(); 
request.open("GET", "/path/to/resource"); 
request.responseType = "blob"; 
request.onload = function() { 
    // do stuff `this.response`:`Blob` 
    console.log(this.response) 
} 
request.send(); 

fetch("/path/to/resource") 
.then(function(response) { 
    return response.blob() 
}) 
.then(function(blob) { 
    // do stuff with response 
    console.log(blob) 
}); 

Answer 2

Dies ist in einem anderen Beitrag als gut bezeichnet - Siehe this Stack Overflow post.

BLOB A steht für ein B inary L ARGE OB jekt. Stellen Sie sich das wie eine Sammlung von Binärdaten vor, die in SQL-Datenbanken gespeichert sind.

Ein BLOB kann Multimedia-Inhalte wie Bilder, Videos und Audio speichern, aber es kann wirklich jede Art von Binärdaten speichern. Da die Standardlänge eines BLOBs nicht Standard ist, können Sie die Speicherkapazität jedes BLOBs bis zu einer Länge von 2.147.483.647 Zeichen definieren. Siehe ein Beispiel dieser here in den MariaDB-Dokumenten.

Da jQuery keine Möglichkeit bietet, mit Blobs umzugehen, könnten Sie versuchen, die native Blob-Schnittstelle zu verwenden. Von MDN's documentation:

:

var oReq = new XMLHttpRequest(); 
oReq.open("GET", "/myfile.png", true); 
oReq.responseType = "arraybuffer"; 

oReq.onload = function(oEvent) { 
    var blob = new Blob([oReq.response], {type: "image/png"}); 
    // ... 
}; 

oReq.send();