Cross-Origin-Embedder-Policy (COEP) header
Der HTTP-Header Cross-Origin-Embedder-Policy (COEP) Antwort-Header konfiguriert die Richtlinie des aktuellen Dokuments zum Laden und Einbetten von Cross-Origin-Ressourcen.
Die Richtlinie, ob eine bestimmte Ressource siteübergreifend eingebettet werden kann, kann für diese Ressource durch den Cross-Origin-Resource-Policy (CORP) Header für einen no-cors-Abruf oder durch CORS definiert werden.
Wenn keine dieser Richtlinien festgelegt ist, können Ressourcen standardmäßig in ein Dokument geladen oder eingebettet werden, als ob sie einen CORP-Wert von cross-origin hätten.
Der Cross-Origin-Embedder-Policy ermöglicht es Ihnen, zu verlangen, dass CORP- oder CORS-Header gesetzt sind, um cross-site Ressourcen in das aktuelle Dokument zu laden. Sie können auch festlegen, dass das Standardverhalten beibehalten wird oder dass die Ressourcen geladen werden dürfen, aber ohne dass Anmeldedaten gesendet werden, die sonst übermittelt würden. Die Richtlinie gilt für geladene Ressourcen sowie für Ressourcen in <iframe>s und verschachtelte Frames.
Hinweis:
Der Cross-Origin-Embedder-Policy überschreibt oder beeinflusst nicht das Einbettungsverhalten für eine Ressource, für die CORP oder CORS gesetzt wurde. Wenn CORP eine Ressource darauf beschränkt, nur same-origin eingebettet zu werden, wird sie unabhängig vom COEP-Wert nicht siteübergreifend in eine Ressource geladen.
| Headertyp | Antwort-Header |
|---|
Syntax
Cross-Origin-Embedder-Policy: unsafe-none | require-corp | credentialless
Direktiven
unsafe-none-
Erlaubt es dem Dokument, Cross-Origin-Ressourcen ohne ausdrückliche Erlaubnis über das CORS-Protokoll oder den
Cross-Origin-Resource-PolicyHeader zu laden. Dies ist der Standardwert. require-corp-
Ein Dokument kann nur Ressourcen von demselben Ursprung oder Ressourcen laden, die ausdrücklich als von einem anderen Ursprung ladbar markiert sind.
Das Laden von Cross-Origin-Ressourcen wird von COEP blockiert, es sei denn:
- Die Ressource wird im
no-cors-Modus angefordert und die Antwort enthält einenCross-Origin-Resource-PolicyHeader, der es erlaubt, sie in das Dokument zu laden. - Die Ressource wird im
cors-Modus angefordert und die Ressource wird von CORS unterstützt und ist erlaubt. Dies kann zum Beispiel in HTML durch dascrossoriginAttribut oder in JavaScript durch eine Anfrage mit{mode="cors"}erfolgen.
- Die Ressource wird im
credentialless-
Ein Dokument kann Cross-Origin-Ressourcen laden, die im
no-cors-Modus ohne ausdrückliche Erlaubnis über denCross-Origin-Resource-PolicyHeader angefordert werden. In diesem Fall werden Anfragen ohne Anmeldedaten gesendet: Cookies werden in der Anfrage ausgelassen und in der Antwort ignoriert.Das Ladeverhalten für Cross-Origin-Anfragen für andere Anfragemodi ist dasselbe wie für
require-corp. Zum Beispiel muss eine imcors-Modus angeforderte Cross-Origin-Ressource CORS unterstützen (und erlaubt sein).
Beispiele
Funktionen, die von Cross-Origin-Isolation abhängen
Bestimmte Funktionen, wie der Zugriff auf SharedArrayBuffer Objekte oder die Verwendung von Performance.now() mit ungedrosselten Timern, sind nur verfügbar, wenn Ihr Dokument siteübergreifend isoliert ist.
Um diese Funktionen in einem Dokument zu verwenden, müssen Sie den COEP-Header mit einem Wert von require-corp oder credentialless setzen und den Cross-Origin-Opener-Policy Header auf same-origin.
Zusätzlich darf die Funktion nicht durch Permissions-Policy: cross-origin-isolated blockiert werden.
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
Sie können die Eigenschaften Window.crossOriginIsolated und WorkerGlobalScope.crossOriginIsolated verwenden, um zu überprüfen, ob die Funktionen in Fenster- und Worker-Kontexten eingeschränkt sind:
const myWorker = new Worker("worker.js");
if (crossOriginIsolated) {
const buffer = new SharedArrayBuffer(16);
myWorker.postMessage(buffer);
} else {
const buffer = new ArrayBuffer(16);
myWorker.postMessage(buffer);
}
Vermeidung der COEP-Blockade mit CORS
Wenn Sie COEP mit require-corp aktivieren und eine Cross-Origin-Ressource einbetten möchten, die CORS unterstützt, müssen Sie ausdrücklich angeben, dass die Ressource im cors-Modus angefordert wird.
Zum Beispiel, um ein in HTML deklariertes Bild von einer Drittanbieter-Website, die CORS unterstützt, abzurufen, können Sie das crossorigin Attribut verwenden, damit es im cors-Modus angefordert wird:
<img src="https://thirdparty.com/img.png" crossorigin />
Sie können ähnlich das HTMLScriptElement.crossOrigin Attribut oder das Abrufen mit { mode: 'cors' } verwenden, um eine Datei im CORS-Modus mit JavaScript anzufordern.
Wenn CORS für einige Bilder nicht unterstützt wird, kann ein COEP-Wert von credentialless als Alternative verwendet werden, um das Bild ohne ausdrückliches Opt-in vom Cross-Origin-Server zu laden, auf Kosten der Anforderung ohne Cookies.
Spezifikationen
| Specification |
|---|
| HTML # coep |
Browser-Kompatibilität
Siehe auch
Cross-Origin-Opener-PolicyWindow.crossOriginIsolatedundWorkerGlobalScope.crossOriginIsolated- Cross Origin Opener Policy in Why you need "cross-origin isolated" for powerful features auf web.dev (2020)
- COOP and COEP explained: Artur Janc, Charlie Reis, Anne van Kesteren (2020)