Eingehende Analyse der Verwendung von Blob-Objekten in HTML5_html5-Tutorial-Fähigkeiten

Das Blob-Objekt in HTML5 und der BLOB-Typ in MYSQL unterscheiden sich konzeptionell. Der BLOB-Typ in MYSQL ist nur ein binärer Datencontainer. Zusätzlich zum Speichern von Binärdaten kann das Blob-Objekt in HTML5 auch den MINE-Typ dieser Daten festlegen, was dem Speichern von Dateien entspricht. Viele andere Binärobjekte erben ebenfalls von diesem Objekt.
In etwas früheren Versionen moderner Browser wurde dieses Blob-Objekt nicht standardisiert und muss daher mit BlobBuilder oder ähnlichem erstellt werden. Da Blob nun jedoch so weit standardisiert ist, dass es direkt vom neuen Konstruktor Blob erstellt werden kann, und fast alle Browser diese Methode bereits unterstützen, besteht kein Grund zur Sorge um den alten Standard.

CSS-CodeInhalt in die Zwischenablage kopieren

1. var data='Cobalt hypocarbonate' ;
2. var blob=new Blob([data],{"type":"text/html" });
3. console.log(blob);

Auf diese Weise erstellen wir ein Blob-Objekt. Der erste Parameter ist ein Datensatz, daher muss es sich um ein Array handeln Im obigen Beispiel muss eine Nummer verwendet werden. Der zweite Parameter ist das Konfigurationsattribut dieses Blob-Objekts. Derzeit muss nur ein Typ, der zugehörige MIME, festgelegt werden. Die Schlüsselwertmethode muss möglicherweise für zukünftige Erweiterungen festgelegt werden.
Was nützt es also, Daten in Blob umzuwandeln? Für Blob-Objekte können wir eine URL erstellen, um darauf zuzugreifen. Verwenden Sie die Methode createObjectURL des URL-Objekts.

CSS-CodeInhalt in die Zwischenablage kopieren

1. var data='Cobalt hypocarbonate' ;
2. var blob=new Blob([data],{"type":"text/html" });
3. onload=function(){
4. var iframe=document.createElement("iframe");
iframe.
5. src=URL.createObjectURL(blob); document.body.appendChild(iframe);
6. };

Auf diese Weise kann nicht nur Text/HTML im obigen Beispiel verwendet werden, sondern jeder vom Browser unterstützte Typ. Darüber hinaus reicht der Lebenszyklus dieser Blob-URL von der Erstellung bis zur Dokumentfreigabe, was keine Ressourcenverschwendung verursacht.

Blob ist ein sehr einfaches binäres Datenobjekt in HTML5. Die Betriebsparameter vieler Methoden unterstützen die Verwendung von Blob. Kurz gesagt, fast alle Methoden, deren Parametertyp Binärdaten ist, unterstützen die Verwendung von Blob als Parameter. Daher kann die Umwandlung der Daten in Blob nachfolgende Vorgänge komfortabler machen.

Methode

slice() Gibt ein neues Blob-Objekt zurück, das die Daten innerhalb des angegebenen Bereichs im Quell-Blob-Objekt enthält.

CSS-Code

Inhalt in die Zwischenablage kopieren

Blob-Slice(

1. optionaler langer Langstart,
2. optionales langes langes Ende,
3. optionaler DOMString contentType
4. };

5. Parameter
   start optional
   start index, kann eine negative Zahl sein, die Syntax ähnelt der Slice-Methode des Arrays. Der Standardwert ist 0.
   end optional
   Endindex, kann eine negative Zahl sein, die Syntax ähnelt der Slice-Methode des Arrays. Der Standardwert ist der letzte Index
   contentType optional
   MIME-Typ des neuen Blob-Objekts wird zum Typattribut des neuen Blob-Objekts. Wert, standardmäßig eine leere Zeichenfolge.
   Rückgabewert
   Ein neues Blob-Objekt, das die Daten innerhalb des angegebenen Bereichs im Quell-Blob-Objekt enthält.
   Hinweis
   Wenn Der Wert des Startparameters ist größer als der Quell-Blob. Wenn der Wert des Größenattributs des Objekts immer noch groß ist, ist der Größenwert des zurückgegebenen Blob-Objekts 0, was bedeutet, dass es keine Daten enthält.

   
   BlobPropertyBag

   Ein Objekt, das zwei Attribute enthält:
   Typ
   legt das Typattribut des Blob-Objekts fest.
   Endungen (veraltet)
   entspricht dem Endungsparameter der BlobBuilder.append()-Methode. Der Wert dieses Parameters kann „transparent“ oder „nativ“ sein.
   Beispiel zur Verwendung des Blob-Konstruktors

   Der folgende Code:
   

   CSS-CodeInhalt in die Zwischenablage kopieren

   1. var aFileParts = ["hey!"];
   2. var oMyBlob = new Blob(aFileParts, { "type" : "text/xml" }) ; // der Klecks

   
   entspricht:
   

   CSS-CodeInhalt in die Zwischenablage kopieren

   1. var oBuilder = new BlobBuilder();
   2. var aFileParts = ["hey!" ];
   3. oBuilder.append(aFileParts[0]);
   var oMyBlob = oBuilder.getBlob(
   4. "text/xml"); // der Blob
   Die BlobBuilder-Schnittstelle bietet eine weitere Möglichkeit, Blob-Objekte zu erstellen, aber diese Methode ist mittlerweile veraltet und sollte daher nicht mehr verwendet werden

   Beispiel: Erstellen Sie eine Objekt-URL mit dem Typ Array und dem Blob-Objekt
   

   CSS-Code
   Inhalt in die Zwischenablage kopieren

   var typedArray = GetTheTypedArraySomehow();
   1. var blob = new Blob([typedArray], {type:
   2. "application/octet-binary"}); // Übergeben Sie einen geeigneten MIME-Typ var
   3. url = URL.createObjectURL(blob); // Erzeugt eine URL-Zeichenfolge ähnlich wie blob:d3958f5c-0777-0845-9dcf-2cb28783acaf
   4. // Sie können es wie eine normale URL verwenden, zum Beispiel auf img.src