URLs de données
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
URLs de données, URLs préfixées par le schéma data:, permettent aux créateur·ice·s de contenu d'intégrer de petits fichiers inline dans des documents. Elles étaient auparavant connues sous le nom de « data URIs » jusqu'à ce que ce nom soit retiré par le WHATWG.
Note : Les URLs de données sont traitées comme des origines opaques uniques par les navigateurs modernes, plutôt que d'hériter de l'origine de l'objet de configuration responsable de la navigation.
Syntaxe
data:[<media-type>][;base64],<data>
data:-
Le schéma de l'URL.
<media-type>Facultatif-
Le type MIME indiquant le type de donnée, comme
image/jpegpour un fichier image JPEG. Si omis, la valeur par défaut esttext/plain;charset=US-ASCII. Vous pouvez consulter une explication complète de la structure des types MIME et un tableau des types MIME courants sur le web. ;base64Facultatif-
Indique que la donnée doit être décodée en base64 ; voir encodage des données au format base64.
<data>-
La donnée elle-même. Si la donnée contient des caractères définis comme réservés dans la RFC 3986 (angl.), ou contient des espaces, des retours à la ligne ou d'autres caractères non imprimables, ces caractères doivent être encodés en pourcentage. Si la donnée est textuelle, vous pouvez intégrer le texte (en utilisant les entités ou échappements appropriés selon le type de document englobant). Sinon, vous pouvez définir
base64pour intégrer des données binaires encodées en base64.
Quelques exemples :
data:,Bonjour%2C%20le%20Monde%20%21-
Les données text/plain
Bonjour, le Monde !. Notez que la virgule est encodée en pourcentage en%2C, et l'espace en%20. data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==-
Version encodée en base64 de l'exemple ci-dessus
data:text/html,%3Ch1%3EBonjour%2C%20le%20Monde%20%21%3C%2Fh1%3E-
Un document HTML avec
<h1>Bonjour, le Monde !</h1> data:text/html,%3Cscript%3Ealert%28%27salut%27%29%3B%3C%2Fscript%3E-
Un document HTML avec
<script>alert('salut');</script>qui exécute une alerte JavaScript. Notez que la balise fermante du script est requise.
Encodage des données au format base64
Base64 est un groupe de schémas d'encodage binaire-vers-texte qui représentent des données binaires dans une chaîne de caractères ASCII en les traduisant en une représentation en base 64. Comme elle n'utilise que des caractères autorisés par la syntaxe des URLs (« sûr pour les URLs »), on peut encoder des données binaires dans des URLs de données sans risque. Base64 utilise les caractères + et /, qui peuvent avoir des significations particulières dans les URLs. Comme les URLs de données n'ont pas de segments de chemin ou de paramètres de requête, cet encodage est sûr dans ce contexte.
Encodage en JavaScript
Les APIs web proposent des méthodes natives pour encoder ou décoder en base64 : Base64.
Encodage sur un système Unix
L'encodage base64 d'un fichier ou d'une chaîne sur les systèmes Linux et macOS peut être réalisé avec la commande base64 (ou, en alternative, l'utilitaire uuencode avec l'argument -m).
echo -n bonjour|base64
# sorties vers la console : Ym9uam91cg==
echo -n bonjour>a.txt
base64 a.txt
# sorties vers la console : Ym9uam91cg==
base64 a.txt>b.txt
# sorties vers le fichier b.txt : Ym9uam91cg==
Encodage sous Microsoft Windows
Sous Windows, Convert.ToBase64String (angl.) de PowerShell peut être utilisé pour effectuer l'encodage Base64 :
[convert]::ToBase64String([Text.Encoding]::UTF8.GetBytes("bonjour"))
# sorties vers la console : Ym9uam91cg==
Alternativement, un shell GNU/Linux (comme WSL) fournit l'utilitaire base64 :
bash$ echo -n bonjour | base64
# sorties vers la console : Ym9uam91cg==
Problèmes habituels
Cette section décrit les problèmes qui apparaissent fréquemment lors de la création et de l'utilisation des URLs de type data
data:text/html,beaucoup de texte…<p><span class%3D"bottom">bas</span>?arg=val</p>
Cela représente une ressource HTML dont le contenu est le suivant :
beaucoup de texte…
<p><span class="bottom">bas</span>?arg=val</p>
- Syntaxe
-
Le format des URLs de type
dataest très simple, mais il est facile d'oublier la virgule avant le segment de données ou de mal encoder la donnée en base64. - Mise en forme HTML
-
Une URL de type
datafournit un fichier dans un fichier, qui peut potentiellement être très large par rapport au document englobant. En tant qu'URL, la donnée devrait pouvoir être mise en forme avec des espaces (saut de ligne, tabulation ou espace), mais des problèmes pratiques apparaissent lors de l'encodage en base64 (angl.). - Limitations de longueur
-
Les navigateurs ne sont pas obligés de supporter une longueur maximale particulière pour la donnée. Chromium et Firefox limitent les URLs de type
dataà 512 Mo, et Safari (WebKit) à 2048 Mo. Notez que Firefox 97 a augmenté la limite de 256 Ko à 32 Mo, et Firefox 136 l'a portée à 512 Mo. - Absence de gestion d'erreur
-
Les paramètres invalides dans le média, ou les coquilles lors de la spécification de
'base64', sont ignorés, mais aucune erreur n'est retournée. - Aucun support des chaînes de requête, etc.
-
La partie donnée d'une URL de type
dataest opaque, donc toute tentative d'utiliser une chaîne de requête (paramètres spécifiques à la page, avec la syntaxe<url>?parameter-data) avec une URL de typedatainclura simplement la chaîne de requête dans la donnée représentée par l'URL. - Problèmes de sécurité
-
De nombreux problèmes de sécurité (par exemple, le phishing) ont été associés aux URLs de type
data, et à la navigation vers celles-ci au niveau supérieur du navigateur. Pour limiter ces problèmes, la navigation de haut niveau vers les URLsdata:est bloquée dans tous les navigateurs modernes. Voir cet article du Mozilla Security Team (angl.) pour plus de détails.
Spécifications
| Specification |
|---|
| The "data" URL scheme> # section-2> |