Hvordan vises Base64-billeder i HTML?

Jeg har problemer med at vise et Base64-billede inline.

Kan nogen pege mig i den rigtige retning?

<!DOCTYPE html>
<html>
  <head>
    <title>Display Image</title>
  </head>
  <body>
    <img style='display:block; width:100px;height:100px;' id='base64image'                 
       src='data:image/jpeg;base64, LzlqLzRBQ...<!-- base64 data -->' />
  </body>
</html>
dda
Redigeret spørgsmål 2017ør januar 2017 в 7:28
Programmering
image html base64 inline
2011ør december 2011 в 4:53
10 visninger
Løsning

Min mistanke er naturligvis faktiske base64-data, ellers ser det godt ud for mig. Se [denne fiddle][1] hvor lignende ordning virker. Du kan prøve at angive char set.

<div>
  <p>Taken from wikpedia</p>
  ![Red dot](data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA
    AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
        9TXL0Y4OHwAAAABJRU5ErkJggg==)
</div>

Du kan prøve denne base64-dekoder for at se, om dine base64-data er korrekte eller ej.

Ruslan López
Redigeret svar 2019ør juli 2019 в 9:57
Kommentarer (7)

Du skal angive korrekt Content-type, Content-encoding og charset som

 data:image/jpeg;charset=utf-8;base64,

i overensstemmelse med syntaksen i data URI-ordningen:

 data:[][;charset=][;base64],
bcag2
Redigeret svar 2019ør september 2019 в 12:12
Kommentarer (4)

+-tegnet, der forekommer i en data-URI, skal kodes som %2B. Dette er som at kode enhver anden streng i en URI. F.eks. skal argumentseparatorer (? og &) kodes, når en URI med et argument sendes som en del af en anden URI.

Kommentarer (0)