Cross-Origin-Embedder-Policy (COEP) header

Der HTTP Cross-Origin-Embedder-Policy (COEP) Response-Header konfiguriert die Richtlinie des aktuellen Dokuments für das Laden und Einbetten von Ressourcen aus verschiedenen Ursprüngen.

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 mithilfe von 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-site 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 die Richtlinie auch so festlegen, dass das Standardverhalten beibehalten wird oder dass das Laden der Ressourcen erlaubt ist, aber alle Anmeldeinformationen entfernt werden, die sonst gesendet würden. Die Richtlinie gilt für geladene Ressourcen sowie für Ressourcen in <iframe>s und geschachtelten Frames.

Hinweis: Der Cross-Origin-Embedder-Policy überschreibt oder beeinflusst nicht das Einbettungsverhalten für eine Ressource, für die CORP oder CORS festgelegt wurde. Wenn CORP eine Ressource auf same-origin beschränkt, wird sie nicht cross-origin in eine Ressource geladen, unabhängig vom COEP-Wert.

Header-Typ Response-Header
Verbotener Response-Header-Name Nein

Syntax

http
Cross-Origin-Embedder-Policy: unsafe-none | require-corp | credentialless

Direktiven

unsafe-none

Ermöglicht dem Dokument, Cross-Origin-Ressourcen ohne ausdrückliche Erlaubnis über das CORS-Protokoll oder den Cross-Origin-Resource-Policy Header zu laden. Dies ist der Standardwert.

require-corp

Ein Dokument kann nur Ressourcen vom gleichen Ursprung oder Ressourcen laden, die ausdrücklich als von einem anderen Ursprung ladbar markiert 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 einen Cross-Origin-Resource-Policy Header, der es erlaubt, sie in den Dokumentursprung zu laden.
  • Die Ressource wird im cors Modus angefordert und ist durch CORS unterstützt und erlaubt. Dies kann beispielsweise in HTML mit dem crossorigin Attribut oder in JavaScript durch eine Anfrage mit {mode="cors"} erfolgen.
credentialless

Ein Dokument kann Cross-Origin-Ressourcen laden, die im no-cors Modus ohne ausdrückliche Erlaubnis über den Cross-Origin-Resource-Policy Header angefordert werden. In diesem Fall werden Anfragen ohne Anmeldeinformationen 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. Beispielsweise muss eine im cors Modus angeforderte Cross-Origin-Ressource CORS unterstützen (und durch CORS erlaubt sein).

Beispiele

Funktionen, die von Cross-Origin-Isolation abhängen

Bestimmte Funktionen, wie der Zugriff auf SharedArrayBuffer Objekte oder die Nutzung von Performance.now() mit ungedrosselten 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.

http
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 in Fenster- und Arbeitskontexten eingeschränkt sind:

js
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-Blockaden 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 abzurufen, die CORS unterstützt, können Sie das crossorigin Attribut verwenden, damit es im cors Modus angefordert wird:

html
<img src="https://thirdparty.com/img.png" crossorigin />

Sie können ähnlich das HTMLScriptElement.crossOrigin Attribut oder fetch mit { mode: 'cors' } verwenden, um eine Datei im CORS-Modus mit JavaScript anzufordern.

Wenn für einige Bilder kein CORS unterstützt wird, kann ein COEP-Wert von credentialless als Alternative verwendet werden, um das Bild ohne ausdrückliches Einverständnis des Cross-Origin-Servers zu laden, allerdings mit dem Nachteil, dass es ohne Cookies angefordert wird.

Spezifikationen

Specification
HTML
# coep

Browser-Kompatibilität

Siehe auch