I'estou tendo problemas para exibir uma imagem Base64 em linha.
Alguém me pode apontar na direcção certa?
<!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>
O meu suspeito é, claro, dados reais da base64, caso contrário, parece-me bem. Veja [este violino][1] onde um esquema similar está funcionando. Você pode tentar especificar o conjunto de caracteres.
<div>
<p>Taken from wikpedia</p>
<img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />
</div>
Você pode tentar este decodificador base64 para ver se os dados da sua base64 estão corretos ou não.
Você precisa especificar o tipo de conteúdo, codificação de conteúdo e conjunto de caracteres corretos como
data:image/jpeg;charset=utf-8;base64,
de acordo com a sintaxe do esquema URI de dados:
data:[<media type>][;charset=<character set>][;base64],<data>
O caractere + que ocorre num URI de dados deve ser codificado como %2B. Isto é como codificar qualquer outra string em um URI. Por exemplo, separadores de argumentos (? e &) devem ser codificados quando um URI com um argumento é enviado como parte de outro URI.