• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

351
Vistas
how to display byte[] as picture in html with java

I use spring mvc and JPA in my project. I get file as byte[] and save in Database. but when I want to display in <img tag of html it don't display.

my entity is:

class Photo {
    @Id
    @GeneratedValue(strategy = GenerationType.AUTO) 
    private Long id;

    private String title;

    @Lob
    private byte[] profilePic;

    // getter and setter
}

value in Database is: enter image description here

but my server response is: enter image description here

{
    "id": 4,
    "title": "pic 1",
    "profilePic": "ZGF0YTppb...VFtQ0M=",
}

and display in html:

<img src='ZGF0YTppb...VFtQ0M=' />
//or
<img src='data:image/jpeg;base64,ZGF0YTppb...VFtQ0M=' />

What to do to display the photo?

thanks

about 3 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Assuming it's base64 encoded:

<img src='data:image/jpeg;base64,ZGF0YTppb...VFtQ0M=' />

Basically you can use data urls with this format depending on what content [type] you want to display:

data:[<mime type>][;charset=<charset>][;base64],<encoded data>

about 3 years ago · Juan Pablo Isaza Denunciar

0

HTML:

<img id="profileImg" src="">

JS:

document.getElementById("profileImg").src = "data:image/png;base64," + profilePic;

This assumes that your image is stored in PNG format (and base64 encoded). For other image format (JPEG, etc.), you need to change the MIME type ("image/..." part) in the URL.

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda