Analyseur de data URI

Comment analyser une data URI

1. Collez l’URI dans la zone. Elle peut aussi se trouver dans du code : une règle CSS avec url("data:..."), une balise <img src="data:..."> ou une image Markdown. La première URI data: est extraite, et la ligne d’état le signale.
2. Lisez le résultat : Type MIME, Paramètres, Encodage (Base64 ou encodé en pourcent), longueur de la Partie données en caractères, Taille décodée et ce à quoi Le contenu ressemble.
3. En dessous, le contenu est prévisualisé avec son SHA-256 et un dump hex : images, SVG, PDF, audio, vidéo, polices, texte, JSON, archives ZIP et plus encore.
4. Utilisez Encodage de sortie pour garder l’URI telle quelle ou la convertir en Base64 ou en encodage URL, choisissez un Format de sortie comme url() CSS ou une balise HTML, et copiez le résultat. Télécharger le fichier enregistre le contenu.

Ce que l’analyseur accepte

L’analyseur suit les règles des data URL du standard Fetch, que les navigateurs implémentent et qui sont plus tolérantes que la RFC 2397 d’origine, si bien qu’il accepte ce qu’accepte un navigateur :

Les sauts de ligne et les tabulations à l’intérieur de l’URI sont supprimés avant l’analyse, comme le font les navigateurs : une URI répartie sur plusieurs lignes dans une feuille de style s’analyse donc quand même. ;base64 est insensible à la casse, les valeurs de paramètres entre guillemets sont déguillemetées, et le Base64 URL-safe est accepté. Les échappements pourcent sont d’abord décodés en octets, si bien que même un corps Base64 écrit %2B%2F fonctionne.

Type déclaré et contenu réel

Le type MIME d’une data URI n’est qu’une étiquette. L’analyseur compare les octets décodés aux signatures de fichiers connues et vous avertit en cas de désaccord :

• data:image/jpeg;base64,iVBORw0KGgo... donne « image/jpeg déclaré, mais le contenu ressemble à du PNG. » Les navigateurs détectent le format des images matricielles, si bien que l’image s’affiche souvent quand même, mais des logiciels plus stricts la rejettent.
• Un type qui n’est pas un type MIME valide, comme image png avec une espace, déclenche un avertissement distinct.

Pour corriger une étiquette, décodez le fichier avec Télécharger le fichier et construisez une URI propre avec le générateur de data URI, ou collez la partie Base64 dans Base64 en fichier, qui propose la bonne extension et le bon type MIME.

Inspecter des liens data: suspects

Les URI data:text/html ont servi au phishing, car toute la fausse page voyage dans le lien, sans serveur derrière qui pourrait être bloqué. Chrome et Firefox refusent désormais d’ouvrir un onglet sur elles depuis un lien, mais on les trouve encore dans des e-mails, des QR codes, des documents et des messages de chat.

Coller un tel lien ici permet de voir sans risque ce qu’il afficherait. Un document HTML complet est rendu dans un cadre en sandbox qui bloque scripts, formulaires et ressources externes, avec la source complète en dessous. Tout autre HTML ou script n’est affiché que sous forme de texte. Les contenus SVG sont dessinés comme des images, qui n’exécutent pas de scripts, et leur balisage est listé pour que vous puissiez chercher des éléments <script> ou des gestionnaires on.... La Content Security Policy de la page ne laisse les scripts se connecter qu’au comptage des pages vues de Cloudflare et ne charge les images que depuis le site lui-même ou depuis des URL data: et blob: : un pixel de suivi ou un script distant dans le contenu n’est donc jamais récupéré.

Réencoder et convertir

Encodage de sortie fait passer une URI dans l’autre encodage sans toucher au contenu :

• Garder tel quel renvoie l’URI sans ses sauts de ligne.
• Base64 convient aux données binaires et aux contextes où les caractères spéciaux posent problème.
• Encodé en URL est plus court pour du texte ASCII simple et du SVG, et lisible dans la source.

Données, Longueur de l’URI et Surcoût sous la sortie montrent quel encodage est le plus court pour vos données. Pour le SVG en particulier, SVG en data URI propose aussi un encodage optimisé et compare les trois, gzip compris.

FAQ