El día de hoy te enseñaré algo muy sencillo pero útil al programar con PHP: cómo mostrar una imagen (existente en el sistema de archivos) codificada en base64 como el atributo src
de un elemento img
generado con PHP.
Veremos cómo leer y codificar la imagen así como colocar el tipo mime correcto.
Imagen en base64
Para insertar una imagen como base64 en una etiqueta img sin usar PHP usamos la siguiente sintaxis:
<img src="data:_MIME_;base64,IMAGEN_EN_BASE64"/>
Estoy indicando el mime y la imagen en mayúsculas y con guiones bajos para que puedas notarlos, pues es obligatorio que se indique el data:
(fíjate en los dos puntos al final), luego el tipo mime, después un punto y coma, la cadena literal base64,
(fíjate en la coma al final) y finalmente la imagen codificada en base64.
Por ejemplo para una imagen PNG:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMcAAAA1CAYAAAD1X//UAAAAAXNSR0IArs4c6...
Fíjate que va el data:, después el mime que es image/png, luego un punto y coma, la cadena base64,
y finalmente toda la imagen codificada que, para este ejemplo, está truncada.
Insertar imagen en base64 usando PHP
Ahora que sabemos eso veamos un ejemplo para codificar una imagen existente pero como base64 leyendo su tipo mime correcto usando PHP. Recuerda que:
mime_content_type
es una función de PHP que devuelve el tipo mime a partir del nombre del archivobase64_encode
codifica la cadena (montón de bytes) que le pasemos como primer argumento en base64file_get_contents
lee el contenido de un archivo y lo devuelve como una cadena en donde están los bytes del archivo
Con esas 3 funciones podemos obtener el mime y codificar la imagen como base64 para mostrarla en una etiqueta img
. También podemos usar la función printf
para que el código sea más limpio:
<?php
$nombreImagen = "parzibyte.png";
$mime = mime_content_type($nombreImagen);
$imagenComoBase64 = base64_encode(file_get_contents($nombreImagen));
?>
<img src="<?php printf("data:%s;base64,%s", $mime, $imagenComoBase64) ?>">
Y así es como podemos mostrar una imagen incrustada. No hay problema con la extensión de la imagen, pues el tipo mime siempre será correcto.
Ahora ya conoces el formato para indicar una cadena en base64 como fuente de una imagen usando PHP para codificar una imagen existente en el sistema de archivos.