Erstellen Sie keine Blobs, sondern erstellen Sie sie.

Hier gibt es eine Mitteilung an alle BlobBuilder-Fans. Auf Wiedersehen.

BlobBuilder ist eine praktische API zum Erstellen von Blobs (oder Dateien) in JavaScript. Es gibt ihn schon seit Chrome 8, FF 6 und IE 10, wurde aber noch nie in Safari ausgeliefert und wahrscheinlich auch nicht. Die jüngsten Spezifikationsänderungen an der File API beinhalten einen neuen Konstruktor für Blob, der BlobBuilder im Wesentlichen irrelevant macht. Tatsächlich wurde sie in Safari Nightly bereits deaktiviert und Chrome wird Sie in Kürze in der Konsole warnen.

Im Folgenden finden Sie zum Vergleich derselbe Code mit dem verworfenen BlobBuilder- und dem neuen Blob-Konstruktor. Das Snippet erstellt ein Stylesheet und hängt es an das DOM an.

BlobBuilder():

window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder ||
                        window.MozBlobBuilder || window.MSBlobBuilder;
window.URL = window.URL || window.webkitURL;

var bb = new BlobBuilder();
bb.append('body { color: red; }');
var blob = bb.getBlob('text/css');

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);

document.body.appendChild(link);

Blob():

window.URL = window.URL || window.webkitURL;

var blob = new Blob(['body { color: red; }'], {type: 'text/css'});

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);
document.body.appendChild(link);

Praktisch! Anstatt das Element an ein BlobBuilder anzuhängen, können wir das Blob jetzt einfach aus einem Array von Datenteilen erstellen. Die Datenteile können verschiedene Typen (DOMString, ArrayBuffer, Blob) und in beliebiger Reihenfolge haben. Beispiel:

var blob = new Blob(['1234567890', blob, arrayBuffer]);

Beachten Sie auch, dass der zweite Objektparameter optional ist. Weitere Informationen zu diesen Änderungen finden Sie in der MDN-Dokumentation zu Blob.