Förstå data:image/png;base64: omslaget och byten

data:image/png;base64, är ett prefix, inte en komplett bild. Den introducerar en inline-resurs: schemat är data, den deklarerade mediatypen är image/png, och markören säger att följande nyttolast använder Base64. Kommat är gränsen mellan metadata och data.

Läs strukturen

data:[media-type][;base64],payload

data:text/plain;base64,SGVsbG8=
data:text/plain,Hello%20world

Det första exemplet representerar texten Hej genom Base64. Den andra använder procentkodning istället. En Data URI parser måste inspektera metadata innan man väljer en avkodare. Att skicka hela URI till en rå Base64-avkodare misslyckas eftersom kolon, semikolon och kommatecken inte är nyttolasttecken.

Dela vid första kommatecken, inte varje komma. Resterande data kan i sig innehålla kommatecken, särskilt i en icke-Base64 text URI. Valfria parametrar av mediatyp kan visas före markören Base64. När mediatypen utelämnas har dataformatet URL en standardtexttyp och teckenuppsättning; att standard inte omvandlar godtyckliga binära bytes till läsbar text.

En etikett MIME är ett påstående

Vem som helst kan placera image/png i prefixet. Etiketten bevisar inte att byten bildar en PNG. Jämför signaturen och be sedan en verklig bildavkodare att ladda resultatet. På samma sätt är ett PDF-huvud bara en ledtråd för igenkänning; en komplett PDF parser kan fortfarande avvisa dokumentet.

Ändras image/png till image/jpeg konverterar inte bilden. Konvertering innebär avkodning av källbilden och kodning av en ny fil i målformatet. Detta kan förändra transparens, metadata, kvalitet och storlek. Behåll originalet när dessa skillnader är viktiga.

Återställ resursen utan att köra den

Analysera och inspektera först. Text kan visas som text, medan stödda rasterbilder kan förhandsgranskas i ett bildelement. Undvik att infoga godtyckliga HTML eller SVG markeringar i dokumentet. En data URL kan representera aktivt innehåll såväl som en bild, så dess fristående karaktär är inte en säkerhetsgaranti.

För en filnedladdning, bevara de avkodade byten och använd ett vettigt tillägg baserat på bekräftad formatinformation. För en diagnostisk rapport, visa deklarerad typ och upptäckt typ separat. Detta gör att missmatchningar syns istället för att gömma dem bakom en lugnande filikon. Data URL syntax och dess standardvärden beskrivs i MDN: datawebbadresser.