data:image/png;base64, ist ein Präfix, kein vollständiges Bild. Es führt eine Inline-Ressource ein: Das Schema ist Daten, der deklarierte Medientyp ist image/png und die Markierung besagt, dass die folgende Nutzlast Base64 verwendet. Das Komma ist die Grenze zwischen Metadaten und Daten.
Lesen Sie die Struktur
data:[media-type][;base64],payload
data:text/plain;base64,SGVsbG8=
data:text/plain,Hello%20worldDas erste Beispiel stellt den Text Hello bis Base64 dar. Der zweite verwendet stattdessen die prozentuale Kodierung. Ein Data URI-Parser muss die Metadaten prüfen, bevor er einen Decoder auswählt. Das Senden des vollständigen URI an einen unformatierten Base64-Decoder schlägt fehl, da Doppelpunkt, Semikolon und Komma keine Nutzzeichen sind.
Beim ersten Komma trennen, nicht bei jedem Komma. Die übrigen Daten können selbst Kommas enthalten, insbesondere in einem Nicht-Base64-Text URI. Vor der Markierung Base64 können optionale Medientypparameter stehen. Wenn der Medientyp weggelassen wird, verfügt das Datenformat URL über einen Standardtexttyp und -zeichensatz. Dieser Standard wandelt keine beliebigen Binärbytes in lesbaren Text um.
Ein MIME-Label ist ein Anspruch
Platzieren kann jeder image/png im Präfix. Die Bezeichnung beweist nicht, dass die Bytes ein PNG bilden. Vergleichen Sie die Signatur und bitten Sie dann einen echten Bilddecoder, das Ergebnis zu laden. Ebenso ist ein PDF-Header nur ein Erkennungshinweis; Ein vollständiger PDF-Parser kann das Dokument dennoch ablehnen.
Verändern image/png zu image/jpeg Konvertiert das Bild nicht. Bei der Konvertierung wird das Quellbild dekodiert und eine neue Datei im Zielformat kodiert. Dadurch können sich Transparenz, Metadaten, Qualität und Größe ändern. Behalten Sie das Original, wenn diese Unterschiede wichtig sind.
Stellen Sie die Ressource wieder her, ohne sie auszuführen
Zuerst analysieren und prüfen. Text kann als Text angezeigt werden, während unterstützte Rasterbilder in einem Bildelement in der Vorschau angezeigt werden können. Vermeiden Sie das Einfügen beliebiger HTML- oder SVG-Markups in das Dokument. Ein Datentyp URL kann sowohl aktiven Inhalt als auch ein Bild darstellen, sodass seine Eigenständigkeit keine Sicherheitsgarantie darstellt.
Behalten Sie beim Herunterladen einer Datei die dekodierten Bytes bei und verwenden Sie eine sinnvolle Erweiterung basierend auf bestätigten Formatinformationen. Für einen Diagnosebericht werden der deklarierte Typ und der erkannte Typ getrennt angezeigt. Dadurch werden Abweichungen sichtbar, anstatt sie hinter einem beruhigenden Dateisymbol zu verbergen. Die Syntax von Data URL und ihre Standardeinstellungen werden in beschrieben MDN: Daten-URLs.