Więcej
Question
Jak wyświetlać obrazy Base64 w HTML?
Mam problem z wyświetlaniem obrazu Base64 w trybie inline.
Czy ktoś może wskazać mi właściwy kierunek?
<!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>
498
3
To pytanie ma 1 odpowiedź w języku angielskim, aby je przeczytać zaloguj się na swoje konto.
Solution / Answer
Moim podejrzanym są oczywiście rzeczywiste dane base64, w przeciwnym razie wygląda to dla mnie dobrze. Zobacz to skrzypce, gdzie działa podobny schemat. Możesz spróbować określić zestaw znaków.
<div>
<p>Taken from wikpedia</p>
<img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />
</div>Możesz spróbować ten dekoder base64, aby sprawdzić, czy twoje dane base64 są poprawne, czy nie.
Musisz określić poprawny Content-type, Content-encoding i charset jak
data:image/jpeg;charset=utf-8;base64, zgodnie ze składnią schematu URI danych:
data:[<media type>][;charset=<character set>][;base64],<data>
Znak + występujący w URI danych powinien być zakodowany jako %2B. Jest to podobne do kodowania każdego innego łańcucha w URI. Na przykład separatory argumentów (? i &) muszą być zakodowane, gdy URI z argumentem jest wysyłany jako część innego URI.
