Hvordan vise Base64-bilder i HTML?

Jeg har problemer med å vise et Base64-bilde inline.

Kan noen peke meg i riktig 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
Redigerte spørsmål 7. januar 2017 в 7:28
Programmering
image html base64 inline
14. desember 2011 в 4:53
8 visninger
Løsning

Min mistanke er selvfølgelig faktiske base64-data, ellers ser det bra ut for meg. Se [this fiddle][1] hvor et lignende opplegg fungerer. Du kan prøve å spesifisere 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-dekoderen for å se om base64-dataene dine er korrekte eller ikke.

Ruslan López
Redigert svar 3. juli 2019 в 9:57
Kommentarer (7)

Du må angi riktig innholdstype, innholdskoding og tegnsett. som

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

i henhold til syntaksen i data URI scheme:

 data:[][;charset=][;base64],
bcag2
Redigert svar 11. september 2019 в 12:12
Kommentarer (4)

+-tegnet som forekommer i en data-URI, skal kodes som %2B. Dette er på samme måte som koding av andre strenger i en URI. For eksempel må argumentseparatorer (? og &) kodes når en URI med et argument sendes som en del av en annen URI.

Kommentarer (0)