Cross-Origin-Embedder-Policy
Der HTTP 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 cross-site eingebettet werden kann, kann für diese Ressource mithilfe des Cross-Origin-Resource-Policy
(CORP) Headers für einen no-cors
-Abruf oder unter Verwendung von CORS definiert werden.
Falls keine dieser Richtlinien festgelegt ist, können Ressourcen standardmäßig in ein Dokument geladen oder eingebettet werden, als hätten sie einen CORP-Wert von cross-site
.
Der Cross-Origin-Embedder-Policy
erlaubt es, zu verlangen, dass CORP- oder CORS-Header gesetzt sind, um Cross-Site-Ressourcen in das aktuelle Dokument zu laden.
Sie können auch die Richtlinie festlegen, um das Standardverhalten beizubehalten oder um zuzulassen, dass Ressourcen geladen werden, aber Anmeldedaten entfernt werden, die sonst gesendet werden könnten.
Die Richtlinie gilt für geladene Ressourcen sowie für Ressourcen in <iframe>
s und verschachtelten Frames.
Hinweis:
Die Cross-Origin-Embedder-Policy
überschreibt nicht oder beeinflusst nicht das Einbettungsverhalten für eine Ressource, für die CORP oder CORS festgelegt wurde.
Wenn CORP eine Ressource darauf beschränkt, nur same-origin
eingebettet zu werden, wird sie unabhängig vom COEP-Wert nicht Cross-Origin in eine Ressource geladen.
Header-Typ | Antwort-Header |
---|---|
Untersagter Antwort-Header-Name | Nein |
Syntax
Cross-Origin-Embedder-Policy: unsafe-none | require-corp | credentialless
Direktiven
unsafe-none
-
Erlaubt dem Dokument, Cross-Origin-Ressourcen ohne ausdrückliche Erlaubnis durch das CORS-Protokoll oder den
Cross-Origin-Resource-Policy
-Header zu laden. Dies ist der Standardwert. require-corp
-
Ein Dokument kann nur Ressourcen von derselben Herkunft laden oder Ressourcen, die ausdrücklich als ladbar von einer anderen Herkunft gekennzeichnet sind.
Das Laden von Cross-Origin-Ressourcen wird durch COEP blockiert, es sei denn:
- Die Ressource wird im
no-cors
-Modus angefordert und die Antwort enthält einenCross-Origin-Resource-Policy
-Header, der erlaubt, sie in die Dokumentherkunft zu laden. - Die Ressource wird im
cors
-Modus angefordert und die Ressource unterstützt und wird von CORS erlaubt. Dies kann beispielsweise in HTML unter Verwendung descrossorigin
-Attributs erfolgen oder in JavaScript, indem eine Anfrage mit{mode="cors"}
gestellt wird.
- 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-Policy
-Header angefordert werden. In diesem Fall werden Anfragen ohne Anmeldedaten gesendet: Cookies werden in der Anfrage weggelassen und in der Antwort ignoriert.Das Cross-Origin-Ladeverhalten 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 von CORS erlaubt sein).
Beispiele
Funktionen, die von Cross-Origin-Isolierung abhängig sind
Bestimmte Funktionen, wie der Zugriff auf SharedArrayBuffer
-Objekte oder die Nutzung von Performance.now()
mit nicht gedrosselten Timern, sind nur verfügbar, wenn Ihr Dokument Cross-Origin 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 sein.
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 prüfen, ob die Funktionen im Fenster- und Worker-Kontext 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 von COEP-Blockierung 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 sie im cors
-Modus angefordert wird.
Um beispielsweise ein in HTML deklariertes Bild von einer Drittanbieter-Website zu holen, die CORS unterstützt, können Sie das crossorigin
-Attribut verwenden, sodass 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 des Cross-Origin-Servers zu laden, auf Kosten der Anforderung ohne Cookies.
Spezifikationen
Specification |
---|
HTML # coep |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Cross-Origin-Embedder-Policy | ||||||||||||
credentialless |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
Siehe auch
Cross-Origin-Opener-Policy
Window.crossOriginIsolated
undWorkerGlobalScope.crossOriginIsolated
- Cross Origin Opener Policy in Why you need "cross-origin isolated" for powerful features auf web.dev (2020)
- COOP und COEP erklärt: Artur Janc, Charlie Reis, Anne van Kesteren (2020)