HTML Imagem base64 no html

KoBoMo · 18 de fevereiro de 2020

É possível inserir uma url da minha API no html abaixo pra que o html converta o base64 em imagem no navegador?

<html>
<head><meta charset='UTF-8'>
</head>
<body>
<p> <img style='display:block; width:1024px;height:1024px;' id='base64image';
src = "data:image/jpeg;base64,???????????"/>
</p>
</body></html>

Leonardo0308 · 18 de fevereiro de 2020

Boa tarde @KoBoMo

Poderia detalhar melhor? Que API é essa? Você já tem a base64 ou vai gerar em algum lugar?

KoBoMo · 18 de fevereiro de 2020

@Leonardo0308

Eu tenho uma API, ela retorna um base64 no endereço "localhost:8080/foto/1", minha pergunta é se ha como colocar esse url nesse codigo html de forma que seja convertido a url em imagem no navegador.

Luís Roberto C. da Silva · 18 de fevereiro de 2020

3 horas atrás, KoBoMo disse:
É possível inserir uma url da minha API no html abaixo pra que o html converta o base64 em imagem no navegador?
<html>
<head><meta charset='UTF-8'>
</head>
<body>
<p> <img style='display:block; width:1024px;height:1024px;' id='base64image';
src = "data:image/jpeg;base64,???????????"/>
</p>
</body></html>

No caso com o código:

<img src = "data:image/jpeg;base64,???????????"/>

Já insere uma imagem, mas o que deve ser escrito no lugar das interrogações é o código base64, que tem centenas de caracteres.

Leonardo0308 · 19 de fevereiro de 2020

14 horas atrás, KoBoMo disse:

Eu tenho uma API, ela retorna um base64 no endereço "localhost:8080/foto/1", minha pergunta é se ha como colocar esse url nesse codigo html de forma que seja convertido a url em imagem no navegador.

Se essa API retornar em formato JSON, você pode utilizar o javascript para pegar a resposta dessa url e colocar dentro do seu <img> com AJAX por exemplo.

KoBoMo · 19 de fevereiro de 2020

@Luís Roberto C. da Silva

sim Luis a minha duvida é exatamente essa, se é possível eu inserir a url no lugar dessas interrogações. pois preciso que a imagem mude conforme o usuário.

1 hora atrás, Leonardo0308 disse:

Se essa API retornar em formato JSON, você pode utilizar o javascript para pegar a resposta dessa url e colocar dentro do seu <img> com AJAX por exemplo.

Na verdade @Leonardo0308 a api retorna uma String em formato base64. Só com html não é possível receber essa String???

tem algum exemplo com javaScript que possa me passar? pra eu ter uma ideia de como fazer.