Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie konvertiere ich eine Daten-URL zurück in eine Blob-Instanz in JavaScript?

Barbara Streisand
Freigeben: 2024-10-26 09:59:29
Original
846 Leute haben es durchsucht

How to Convert a Data URL Back to a Blob Instance in JavaScript?

Blob-Instanz von DataURL abrufen

Das Konvertieren beliebiger Daten in eine Daten-URL mithilfe von readAsDataURL() von FileReader ist eine häufige Aufgabe. Wenn jedoch die Notwendigkeit besteht, eine Daten-URL wieder in eine Blob-Instanz umzuwandeln, können die integrierten Browser-APIs unklar erscheinen.

Um dieses Problem zu lösen, hat Matt in einer früheren Diskussion eine Lösung angeboten (So konvertieren Sie dataURL zum Dateiobjekt in Javascript?). Während BlobBuilder jetzt veraltet ist, wandelt der aktualisierte Code Daten-URLs effektiv in Blobs um:

<code class="js">function dataURItoBlob(dataURI) {
  const byteString = atob(dataURI.split(',')[1]);
  const mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];

  const ab = new ArrayBuffer(byteString.length);
  const ia = new Uint8Array(ab);

  for (let i = 0; i < byteString.length; i++) {
    ia[i] = byteString.charCodeAt(i);
  }

  return new Blob([ab], { type: mimeString });
}</code>
Nach dem Login kopieren

Dieses Code-Snippet wandelt Daten-URLs mühelos in Blobs um, geht auf die anfängliche Abfrage ein und bietet ein praktisches Tool zur Datenbearbeitung.

Das obige ist der detaillierte Inhalt vonWie konvertiere ich eine Daten-URL zurück in eine Blob-Instanz in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!