Mise à jour du 09/10/2024.
La balise <img> est généralement utilisée avec l’attribut src qui pointe sur un URL qui désigne le fichier image à afficher. Or, nos images sont stockées en base de données et non dans un fichier. La balise <img> permet toutefois de produire cette image au fil de l’eau sans passer par la conversion sous forme d’un fichier.
Il suffit de récupérer le flux binaire constituant l’image en base de données, de le coder en Base64 puis de construire la valeur de l’attribut src selon le format :
<img src="data:image/{format comme jpeg, gif, png, etc.};base64,{contenu binaire codé Base 64 de l’image}"
title="{Contenu de l’infobulle au survol de la souris}"/>
Notez que l’attribut alt n’a plus vraiment de sens puisque l’image fait partie intégrante de la page. Elle n’a de sens que si la page devait être utilisée en mode console ; ce qui ne se voit pratiquement plus.
Voici un exemple :
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABA {contenu de l’image transcodé Base64} FFFFFK4rn//2Q=="
alt="">Rédaction par Jean-Marie Piatte (1983-2021)