Découvrez pourquoi l'isolation multi-origine est nécessaire pour utiliser des fonctionnalités puissantes telles que SharedArrayBuffer, performance.measureUserAgentSpecificMemory() et un minuteur haute résolution avec une meilleure précision.
Introduction
Dans la section Rendre votre site Web isolé multi-origine avec COOP et COEP, nous vous avons expliqué comment adopter le "cross-origin", isolés" à l’aide de COOP et COEP. Cet article d'accompagnement explique pourquoi l'isolation multi-origine est nécessaire pour activer des fonctionnalités puissantes dans le navigateur.
Contexte
Le Web est basé sur la même origine
"policy": il s'agit d'une fonctionnalité de sécurité qui limite
comment les documents et les scripts peuvent
interagir avec des ressources d’une autre origine. Ce
limite les façons dont les sites Web peuvent accéder aux ressources multi-origines. Pour
exemple, un document provenant de https://a.example n'a pas accès aux données
hébergé à https://b.example.
Cependant, la règle d'origine commune présente des exceptions historiques. Tout site Web peut:
- Intégrer des iFrames multi-origines
- Inclure des ressources multi-origines telles que des images ou des scripts
- Ouvrir des fenêtres pop-up multi-origines avec une référence DOM
Si le Web pouvait être conçu à partir de zéro, ces exceptions n'existeraient pas. Malheureusement, lorsque la communauté Web a réalisé les principaux avantages d'une très stricte, le Web s'appuyait déjà sur ces exceptions.
Les effets secondaires sur la sécurité d'une telle politique laxiste de même origine ont été corrigés dans deux
de différentes manières. L'une d'elles a été l'introduction d'un nouveau protocole appelé Cross-Cross
Partage des ressources de l'origine (CORS)
dont le but est de s'assurer que le serveur autorise le partage d'une ressource avec
une origine donnée. L'autre méthode consiste à supprimer implicitement l'accès direct au script
les ressources multi-origines tout en préservant la rétrocompatibilité. Telles
les ressources multi-origines sont appelées "opaques" ressources. Par exemple, c’est pourquoi
manipuler les pixels d'une image multi-origine via CanvasRenderingContext2D ;
échoue, sauf si CORS est appliqué à l'image.
Toutes ces décisions concernant les règles sont prises au sein d'un groupe de contexte de navigation.
Pendant longtemps, la combinaison du CORS et des ressources opaques a suffi pour la sécurité des navigateurs. Parfois, les cas particuliers (JSON failles) ont été découvertes et devaient faire l'objet de correctifs, mais dans l'ensemble, le principe l'accès direct en lecture aux octets bruts des ressources multi-origines était réussi.
Tout a changé avec
Spectre, qui
toutes les données chargées dans le même groupe de contexte de navigation que votre code
potentiellement lisibles. En mesurant le temps nécessaire à certaines opérations, les attaquants
de deviner le contenu des caches CPU
qui permet de déterminer le contenu
processus" mémoire. De telles attaques temporelles sont possibles avec des minuteurs à faible précision
disponibles sur la plate-forme, mais qui peuvent être accélérées grâce à des minuteurs très précis,
à la fois explicites (comme performance.now()) et implicites (comme
SharedArrayBuffer). Si evil.com intègre une image multi-origine, il peut utiliser un
Spectre pour lire ses données de pixels.
Les protections s'appuient donc sur
"opacité" inefficaces.
Idéalement, toutes les requêtes multi-origines doivent être explicitement approuvées par le serveur qui possède la ressource. Si l'évaluation n'est pas assurée par propriétaire des ressources, alors les données n'arriveront jamais dans la d'un acteur malintentionné, et donc hors de portée de tout Spectre attaques qu'une page Web pourrait mener. C'est ce que nous appelons un état isolé multi-origine. C'est exactement le sujet de COOP+COEP.
Dans un état isolé multi-origine, le site à l'origine de la demande est considéré comme étant moins
dangereux, ce qui débloque des fonctionnalités puissantes comme SharedArrayBuffer,
performance.measureUserAgentSpecificMemory() et haute résolution
des minuteurs avec une meilleure précision,
ou pour des attaques de type Spectre. Elle empêche également
de modifier
document.domain
Règlement de l'intégrateur multi-origine
Intégration multi-origine (COEP, Policy Controller) empêche de charger des ressources multi-origines qui n'accordent pas explicitement l'autorisation du document (à l'aide de CORP ou CORS). Cette fonctionnalité vous permet de déclarer qu'un document ne peut pas charger de telles ressources.
Pour activer cette règle, ajoutez l'en-tête HTTP suivant au document:
Cross-Origin-Embedder-Policy: require-corp
Le mot clé require-corp est la seule valeur acceptée pour COEP. Cela applique
la règle indiquant que le document ne peut charger que des ressources de même origine ; ou
ressources explicitement marquées comme pouvant être chargées à partir d'une autre origine.
Pour que les ressources puissent être chargées à partir d'une autre origine, elles doivent être compatibles avec CORS (Cross-Origin Resource Sharing) ou CORP (Cross-Origin Resource Policy)
Partage des ressources entre origines multiples
Si une ressource multi-origine est compatible avec le partage des ressources entre origines multiples,
(CORS), vous pouvez utiliser
crossorigin
attribut
pour le charger sur votre page Web
sans être bloqué par COEP.
<img src="https://third-party.example.com/image.jpg" crossorigin>
Par exemple, si cette ressource d'image est diffusée avec des en-têtes CORS, utilisez
crossorigin afin que la requête d'extraction de la ressource utilise CORS
mode. De plus,
empêche le chargement de l'image, sauf s'il définit des en-têtes CORS.
De même, vous pouvez récupérer des données multi-origines via la méthode fetch(), qui
ne nécessite pas de manipulation particulière tant que le serveur répond avec la bonne réponse.
HTTP
en-têtes.
Règle de ressource multi-origine
Règle de ressources multi-origines (CORP) a été introduit pour empêcher l'accès à vos ressources chargées par une autre origine. Dans le contexte de COEP, CORP peut spécifier la ressource la règle du propriétaire pour savoir qui peut charger une ressource.
L'en-tête Cross-Origin-Resource-Policy peut avoir trois valeurs:
Cross-Origin-Resource-Policy: same-site
Les ressources marquées comme same-site ne peuvent être chargées qu'à partir du même site.
Cross-Origin-Resource-Policy: same-origin
Les ressources marquées comme same-origin ne peuvent être chargées qu'à partir de la même origine.
Cross-Origin-Resource-Policy: cross-origin
Les ressources portant la mention cross-origin peuvent être chargées par n'importe quel site Web. (Ce
CORP et COEP.)
Règle d'ouverture multi-origine
Règle d'ouverture multi-origine
(COOP) vous permet de vérifier
qu'une fenêtre racine est isolée des autres documents en les plaçant dans une
un groupe de contexte de navigation différent, de sorte qu'ils ne puissent pas interagir directement avec
fenêtre racine. Par exemple, si un document avec COOP ouvre un pop-up, son
La propriété window.opener sera null. De plus, la propriété .closed de
la référence d'opener à celui-ci renverra true.
L'en-tête Cross-Origin-Opener-Policy peut avoir trois valeurs:
Cross-Origin-Opener-Policy: same-origin
Les documents marqués same-origin peuvent partager le même contexte de navigation
groupe contenant des documents d'origine identique qui sont également explicitement marqués same-origin.
Cross-Origin-Opener-Policy: same-origin-allow-popups
Un document de premier niveau avec same-origin-allow-popups conserve les références aux
de ses fenêtres pop-up qui ne définissent pas de mode COOP ou qui désactivent l'isolation en
en définissant un COOP de unsafe-none.
Cross-Origin-Opener-Policy: unsafe-none
unsafe-none est le paramètre par défaut et permet d'ajouter le document au fichier d'ouverture de son
le groupe de contexte de navigation, sauf si l'ouverture elle-même a un COOP de same-origin.
Résumé
Pour bénéficier d'un accès garanti à des fonctionnalités performantes comme SharedArrayBuffer,
performance.measureUserAgentSpecificMemory() ou haute résolution
des minuteurs avec une meilleure précision, n'oubliez pas
que votre document doit utiliser à la fois COEP avec la valeur require-corp et
COOP avec la valeur de same-origin. En l'absence de l'un ou de l'autre, le navigateur
ne garantissent pas une isolation suffisante
pour activer ces fonctionnalités puissantes en toute sécurité. Toi
peut déterminer la situation de votre page en vérifiant
self.crossOriginIsolated
renvoie true.
Découvrez la procédure à suivre dans la section Rendre votre site Web multi-origine isolés" avec COOP et COEP.