Hier erfahren Sie, warum die ursprungsübergreifende Isolierung erforderlich ist, um leistungsstarke Funktionen wie SharedArrayBuffer, performance.measureUserAgentSpecificMemory() und einen hochauflösenden Timer genauer zu nutzen.
Einführung
Lesen Sie in der Anleitung Website ursprungsübergreifend isoliert machen“. mit COOP und COEP haben wir erklärt, wie die ursprungsübergreifende isoliert" mithilfe von COOP und COEP. In diesem Begleitartikel wird erklärt, warum die ursprungsübergreifende Isolierung erforderlich ist, um leistungsstarke Funktionen im Browser zu aktivieren.
Hintergrund
Das Web basiert auf Same-Origin-
: Eine Sicherheitsfunktion, die
wie Dokumente und Skripts mit Ressourcen
anderer Herkunft interagieren können. Dieses
schränkt die Möglichkeiten ein, wie Websites auf ursprungsübergreifende Ressourcen zugreifen können. Für
Beispiel: Ein Dokument von „https://a.example“ kann nicht auf Daten zugreifen
gehostet bei https://b.example.
Für dieselbe Richtlinie für denselben Ursprung gab es jedoch in der Vergangenheit einige Ausnahmen. Jede Website kann:
- Ursprungsübergreifende iFrames einbetten
- Ursprungsübergreifende Ressourcen wie Bilder oder Skripts einschließen
- Ursprungsübergreifende Pop-up-Fenster mit einer DOM-Referenz öffnen
Könnte das Web von Grund auf neu gestaltet werden, gäbe es diese Ausnahmen nicht. Als die Web-Community die wichtigsten Vorteile eines strengen Same-Origin-Policy, hat sich das Web bereits auf diese Ausnahmen gestützt.
Die sicherheitsrelevanten Nebeneffekte einer solchen laxen Same-Origin-Policy wurden in zwei
. Eine Möglichkeit war die Einführung eines neuen Protokolls namens Cross-
Origin Resource Sharing (CORS)
der dafür sorgt, dass der Server die Freigabe einer Ressource für einen
mit einem bestimmten Ursprung. Oder Sie entfernen den direkten Skriptzugriff
ursprungsübergreifenden Ressourcen unter Beibehaltung der Abwärtskompatibilität. Ein solches
ursprungsübergreifende Ressourcen werden als „opaque“ bezeichnet. Ressourcen. Aus diesem Grund
Pixel eines ursprungsübergreifenden Bildes mithilfe von CanvasRenderingContext2D manipulieren
schlägt fehl, sofern nicht CORS auf das Image angewendet wird.
Alle diese Richtlinienentscheidungen werden innerhalb einer Browserkontextgruppe getroffen.
Lange Zeit reichte die Kombination aus CORS und undurchsichtigen Ressourcen aus, Browser sicher sind. Manchmal können Grenzfälle (wie JSON Sicherheitslücken) gefunden wurden und gepatcht werden mussten. direkten Lesezugriff auf die Rohbyte von ursprungsübergreifenden Ressourcen erfolgreich war.
All dies hat sich geändert mit
Spectre,
alle Daten, die in dieselbe Browserkontextgruppe geladen werden wie Ihr Code,
lesbar sein. Durch die Messung der Zeit, die bestimmte Abläufe in Anspruch nehmen, können Angreifer
den Inhalt der CPU-Cache-Speicher erraten kann.
Prozess zu speichern. Solche Timing-Angriffe sind mit Timern mit niedriger Granularität möglich
die bereits auf der Plattform vorhanden sind, aber mit Timern mit hoher Detailgenauigkeit,
sowohl explizit (wie performance.now()) als auch implizit (wie
SharedArrayBuffer). Wenn evil.com ein ursprungsübergreifendes Bild einbettet, kann ein
Spectre-Angriff zum Lesen seiner Pixeldaten.
"Undurchsichtigkeit" unwirksam sein.
Idealerweise sollten alle ursprungsübergreifenden Anfragen explizit vom Server überprüft werden. dem die Ressource gehört. Wird keine Überprüfung durch auf dem ressourceneigenen Server, kommen die Daten niemals auf dem Kontextgruppe eines bösen Schauspielers und bleibt deshalb außerhalb der Reichweite die eine Webseite ausführen könnte. Wir nennen das einen ursprungsübergreifend isolierten Zustand. Genau darum geht es bei COOP+COEP.
In einem ursprungsübergreifend isolierten Zustand gilt die anfragende Website als weniger
und dadurch leistungsstarke Funktionen wie SharedArrayBuffer,
performance.measureUserAgentSpecificMemory() und hohe Auflösung
können Sie sogar Timern genauer angeben,
für spektreähnliche Angriffe verwendet werden. Außerdem wird verhindert, dass Änderungen
document.domain
Cross-Origin-Embedder-Richtlinie
Cross-Origin-Embedder Richtlinie (COEP) verhindert, dass ein das Laden ursprungsübergreifender Ressourcen, die nicht explizit Dokumentberechtigung (mit CORP oder CORS) Mit dieser Funktion können Sie dass ein Dokument solche Ressourcen nicht laden kann.
Hängen Sie zum Aktivieren dieser Richtlinie den folgenden HTTP-Header an das Dokument an:
Cross-Origin-Embedder-Policy: require-corp
Das Keyword require-corp ist der einzige zulässige Wert für COEP. Dies erzwingt
Die Richtlinie, dass das Dokument nur Ressourcen aus demselben Ursprung laden kann, oder
Ressourcen, die explizit als aus einem anderen Ursprung ladebar gekennzeichnet sind.
Damit Ressourcen von einem anderen Ursprung geladen werden können, müssen sie entweder Cross-Origin Resource Sharing (CORS) oder Cross-Origin Resource Policy (CORP) verwenden.
Cross-Origin Resource Sharing
Wenn eine ursprungsübergreifende Ressource Cross-Origin Resource Sharing unterstützt
(CORS) verwenden, können Sie das
crossorigin
Attribut
um sie auf Ihre Webseite zu laden, ohne von COEP blockiert zu werden.
<img src="https://third-party.example.com/image.jpg" crossorigin>
Wenn diese Bildressource beispielsweise mit CORS-Headern bereitgestellt wird, verwenden Sie die Methode
crossorigin-Attribut, damit die Anfrage zum Abrufen der Ressource CORS verwendet.
Modus an. Dies gilt auch für
verhindert, dass das Bild geladen wird, es sei denn, es werden CORS-Header festgelegt.
In ähnlicher Weise können Sie ursprungsübergreifende Daten über die Methode fetch() abrufen, die
erfordert keine besondere Behandlung, solange der Server mit der richtigen Antwort
HTTP
Header.
Cross-Origin-Ressourcenrichtlinie
Cross-Origin-Ressourcenrichtlinie (CORP) wurde ursprünglich als Opt-in eingeführt, um Ihre Ressourcen vor von einem anderen Ursprung geladen werden. Im Kontext von COEP kann CORP die Ressource angeben. Inhaberrichtlinie für das Laden von Ressourcen.
Der Header Cross-Origin-Resource-Policy hat drei mögliche Werte:
Cross-Origin-Resource-Policy: same-site
Mit same-site gekennzeichnete Ressourcen können nur von derselben Website geladen werden.
Cross-Origin-Resource-Policy: same-origin
Ressourcen, die als same-origin gekennzeichnet sind, können nur aus demselben Ursprung geladen werden.
Cross-Origin-Resource-Policy: cross-origin
Mit cross-origin gekennzeichnete Ressourcen können von jeder beliebigen Website geladen werden. (Diese
Wert hinzugefügt wurde.
CORP-Spezifikation zusammen mit COEP.)
Cross-Origin-Opener-Richtlinie
Cross-Origin-Opener-Richtlinie
(COOP) können Sie sicherstellen,
dass ein Fenster der obersten Ebene von anderen Dokumenten isoliert wird, indem sie in einem
Gruppen unterschiedlicher Browserkontexte, sodass sie nicht direkt mit dem
oberste Ebene. Wenn beispielsweise ein Dokument mit COOP ein Popup-Fenster öffnet, werden seine
Die Property „window.opener“ wird dann „null“. Außerdem ist das Attribut .closed der
für den Opener-Verweis darauf true zurück.
Der Header Cross-Origin-Opener-Policy hat drei mögliche Werte:
Cross-Origin-Opener-Policy: same-origin
Dokumente, die als same-origin markiert sind, können denselben Browserkontext verwenden.
Gruppe mit Dokumenten mit demselben Ursprung, die ebenfalls explizit als same-origin gekennzeichnet sind.
Cross-Origin-Opener-Policy: same-origin-allow-popups
Ein Dokument der obersten Ebene mit same-origin-allow-popups behält Verweise auf alle
seiner Pop-ups, die entweder COOP nicht festlegen oder die Isolation durch
COOP von unsafe-none wird festgelegt.
Cross-Origin-Opener-Policy: unsafe-none
unsafe-none ist die Standardeinstellung und ermöglicht, dass das Dokument zum Öffnende hinzugefügt werden kann.
Browser-Kontextgruppe, es sei denn, das Öffnende selbst hat den COOP-Wert same-origin.
Zusammenfassung
Wenn Sie garantierten Zugriff auf leistungsstarke Funktionen wie SharedArrayBuffer wünschen,
performance.measureUserAgentSpecificMemory() oder hohe Auflösung
Timer genauer einstellen, denken Sie einfach daran,
dass Ihr Dokument sowohl COEP mit dem Wert require-corp als auch
COOP mit dem Wert same-origin. Fehlt diese, wird der Browser
keine ausreichende Isolation garantiert,
um diese leistungsstarken Funktionen sicher zu aktivieren. Ich
um die Situation Ihrer Seite zu ermitteln,
self.crossOriginIsolated
gibt true zurück.
Die Schritte zur Implementierung dieser Funktion finden Sie unter Ihre Website ursprungsübergreifend gestalten. isoliert" COOP und COEP