Как да показваме Base64 изображения в HTML?

Имам проблем с показването на изображение Base64 в ред.

Може ли някой да ме насочи в правилната посока?

<!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
Редактиран въпрос Направете януари 2017 в 7:28
Програмиране
image html base64 inline
Направете декември 2011 в 4:53
24 изгледи
Решение

Разбира се, подозирам, че действителните данни са base64, но иначе ми изглежда добре. Вижте [този фидъл][1], където работи подобна схема. Може да опитате да посочите char set.

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

Можете да опитате този декодер на base64, за да видите дали данните ви в base64 са верни или не.

Ruslan López
Редактиран отговор Направете юли 2019 в 9:57
Коментари (7)

Необходимо е да посочите правилните Content-type, Content-encoding и charset като

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

в съответствие със синтаксиса на схемата за URI на данни:

 data:[][;charset=][;base64],
bcag2
Редактиран отговор Направете септември 2019 в 12:12
Коментари (4)

Символът +, който се среща в URI на данни, трябва да се кодира като %2B. Това е като кодирането на всеки друг низ в URI. Например разделителите на аргументи (? и &) трябва да се кодират, когато URI с аргумент се изпраща като част от друг URI.

Коментари (0)