Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
Attribut HTML : crossorigin
L'attributcrossorigin est valide sur les éléments HTML<audio>,<img>,<link>,<script> et<video>. Il permet de gérer leCORS, 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 contenucrossorigin sur les éléments média est un attribut de configuration CORS.
Ces attributs sonténumérés et acceptent les valeurs suivantes :
anonymousLa requête utilise les en-têtes CORS et le drapeau credentials est positionné à
'same-origin'. Il n'y a aucun échange dedonné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-credentialsLa requête utilise les en-têtes CORS, le drapeau credentials est positionné à
'include'et lesdonné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é commepollué. |
script | L'accès à la journalisation des erreurs viawindow.onerror sera limité. |
link | Une requête sans en-têtecrossorigin approprié peut être ignorée. |
Note :L'attributcrossorigin n'est pas pris en charge pourrel="icon" dans les navigateurs basés sur Chromium. Voir leticket Chromium ouvert(angl.).
Exemples
Utilisercrossorigin avec l'élémentscript
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 valeuruse-credentials doit être utilisée lorsqu'on récupère unmanifeste 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 |