Attribut HTML : crossorigin

L'attribut crossorigin est valide sur les éléments HTML <audio>, <img>, <link>, <script> et <video>. Il permet de gérer le CORS, c'est-à-dire la façon dont l'élément traite les requêtes inter-origines, et donc de configurer les requêtes CORS pour les données récupérées par l'élément. Selon l'élément, l'attribut peut être un attribut de configuration CORS.

L'attribut de contenu crossorigin sur les éléments média est un attribut de configuration CORS.

Ces attributs sont énumérés et acceptent les valeurs suivantes :

anonymous

La requête utilise les en-têtes CORS et le drapeau credentials est positionné à 'same-origin'. Il n'y a aucun échange de données d'identification utilisateur via les cookies, certificats TLS côté client ou authentification HTTP, sauf si la destination est la même origine.

use-credentials

La requête utilise les en-têtes CORS, le drapeau credentials est positionné à 'include' et les données d'identification utilisateur sont toujours incluses.

""

Définir l'attribut sans valeur ou avec une valeur vide, comme crossorigin ou crossorigin="", revient à utiliser anonymous.

Un mot-clé invalide ou une chaîne vide sera traité comme le mot-clé anonymous.

Par défaut (c'est-à-dire si l'attribut n'est pas défini), CORS n'est pas utilisé. L'agent utilisateur ne demandera pas d'accès complet à la ressource et, en cas de requête inter-origine, certaines limitations s'appliqueront selon le type d'élément concerné :

Exemples

Utiliser crossorigin avec l'élément script

On peut utiliser l'élément <script> afin d'indiquer au navigateur d'exécuter un script (ici, https://exemple.fr/framework-exemple.js) sans envoyer les informations d'authentification de l'utilisateur·ice.

<script
 src="https://exemple.fr/framework-exemple.js"
 crossorigin="anonymous"></script>

Utiliser des informations d'authentification avec un manifeste

La valeur use-credentials doit être utilisée lorsqu'on récupère un manifeste nécessitant des informations d'authentification, y compris lorsque le fichier provient de la même origine :

<link rel="manifest" href="/app.manifest" crossorigin="use-credentials" />

Spécifications

Compatibilité des navigateurs

html.elements.audio.crossorigin

html.elements.img.crossorigin

html.elements.link.crossorigin

html.elements.script.crossorigin

html.elements.video.crossorigin

Voir aussi

• Partage des ressources entre origines (CORS)
• L'attribut rel