Le Data URI Schema

Il vous est sans doute arrivé de voir dans le code source d’une page HTML des liens vers des images du type :

data:image/png;base64,...

Le seul intérêt de cette technique de liens définie dans le Data URI Scheme est de diminuer le nombre de requêtes HTTP/HTTPS vers le serveur.  Embarquées dans le code HTML de la page, ces images ne peuvent pas servir aux marketeux pour vous tracker !  Par précaution, j’ai ajouté à mes filtres AdBlocks Plus une règle bloquant les liens Data URL pouvant contenir du code HTML ou JavaScript :

|data:text/

Convertir une image au format Data URL

Il existe un service en ligne au nom de Data URL Maker qui vous permet de convertir vos images au format Data URL.

Le Data URI Schema

Code HTML

Vous pouvez aussi utiliser l’utilitaire uuencode qui se trouve dans le package sharutils sous CentOS/Red Hat/Fedora, qui s’utilise de la manière suivante :

uuencode -m votre_image.jpg nom_de_l_image >> test.html

Vous devez inclure le code généré par uuencode ou récupéré du service Data URL Maker au niveau des trois petits points :

<html>
  <body>
    <img src="data:image/jpg;base64,..."/>
  </body>
</html>

Code PHP

Vous pouvez utiliser le PHP :

<html>
  <body>
    <img src="data:image/jpg;base64,<?php echo base64_encode(file_get_contents('/home/www/votre_image.jpg'));?>" />
  </body>
</html>

Html  / Formateur PHP html php