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
crossoriginoucrossorigin="", revient à utiliseranonymous.
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é :
| Élément | Restrictions |
img, audio, video |
Si la ressource est placée dans un <canvas>, l'élément est marqué comme pollué.
|
script |
L'accès à la journalisation des erreurs via window.onerror sera limité.
|
link |
Une requête sans en-tête crossorigin approprié peut être ignorée.
|
Note :
L'attribut crossorigin n'est pas pris en charge pour rel="icon" dans les navigateurs basés sur Chromium. Voir le ticket Chromium ouvert (angl.).
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.
<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
| Specification |
|---|
| HTML> # cors-settings-attributes> |
Compatibilité des navigateurs
>html.elements.audio.crossorigin
Chargement…
html.elements.img.crossorigin
Chargement…
html.elements.link.crossorigin
Chargement…
html.elements.script.crossorigin
Chargement…
html.elements.video.crossorigin
Chargement…
Voir aussi
- Partage des ressources entre origines (CORS)
- L'attribut HTML
rel