Fenced Frame API

Konzepte und Verwendung

Eine der Hauptquellen von Privatheits- und Sicherheitsproblemen im Web sind Inhalte, die in <iframe>-Elementen eingebettet sind. Historisch gesehen wurden <iframe>s verwendet, um Drittanbieter-Cookies zu setzen, die zur Informationsweitergabe und zum Tracking von Nutzern über verschiedene Websites hinweg genutzt werden können. Zusätzlich kann eingebetteter Inhalt in einem <iframe> mit dem einbettenden Dokument kommunizieren (zum Beispiel mithilfe von Window.postMessage()).

Das einbettende Dokument kann ebenfalls Skripting verwenden, um verschiedene Arten von Informationen aus dem <iframe> zu lesen — zum Beispiel kann man bedeutende Tracking-/Fingerabdruck-Daten durch das Lesen der eingebetteten URL aus der src-Eigenschaft erhalten, insbesondere wenn diese URL-Parameter enthält. Das <iframe> kann zudem auf das DOM des einbettenden Kontextes zugreifen und umgekehrt.

Die meisten modernen Browser arbeiten an Mechanismen zur Partitionierung von Speicher, damit Cookie-Daten nicht mehr für Trackingzwecke genutzt werden können (siehe beispielsweise Cookies mit unabhängigen partitionierten Zuständen (CHIPS) oder Firefox State Partitioning).

<fencedframe>-Elemente zielen darauf ab, ein weiteres Stück dieses Puzzles zu lösen — sie sind in Form und Funktion <iframe>s sehr ähnlich, außer dass:

• Kommunikation nicht zwischen dem <fencedframe>-Inhalt und seiner einbettenden Website geteilt werden kann.
• Ein <fencedframe> kann auf Cross-Site-Daten zugreifen, aber nur in einem sehr spezifischen, kontrollierten Umfang, der die Privatsphäre des Nutzers wahrt.
• Ein <fencedframe> kann nicht frei manipuliert oder über reguläre Skripte zugegriffen werden (zum Beispiel das Lesen oder Setzen der Quell-URL). <fencedframe>-Inhalte können nur über spezifische APIs eingebettet werden.
• Ein <fencedframe> kann nicht auf das DOM des einbettenden Kontextes zugreifen, noch kann der einbettende Kontext auf das DOM des <fencedframe> zugreifen.

Für weitere Informationen über das Kommunikationsmodell von fenced frames lesen Sie den Leitfaden zur Kommunikation mit eingebetteten Frames.

Anwendungsfälle

<fencedframe>s werden von anderen APIs verwendet, um verschiedene Arten von Cross-Site-Inhalten einzubetten oder Daten zu sammeln und damit unterschiedliche Anwendungsfälle auf eine privatsphärenfreundliche Weise zu erfüllen. Die meisten dieser Anwendungsfälle basierten zuvor auf Drittanbieter-Cookies oder anderen Mechanismen, die für die Privatsphäre schädlich waren.

• Die Shared Storage API bietet Zugriff auf unpartitionierte Cross-Site-Daten in einer sicheren Umgebung und berechnet bzw. zeigt Ergebnisse in einem <fencedframe> an. Zum Beispiel:
  • Werbetreibende können die Reichweite einer Anzeige messen oder nachfolgende Anzeigen auf Basis der bereits auf anderen Websites gesehenen Anzeigen schalten.
  • Entwickler können A/B-Tests durchführen, indem sie einem Nutzer basierend auf einer zugewiesenen Gruppe oder der Anzahl der bereits gesehenen Varianten unterschiedliche Varianten zeigen.
  • Unternehmen können die Nutzererfahrung basierend auf dem, was der Nutzer bereits auf anderen Seiten gesehen hat, anpassen. Zum Beispiel, wenn der Nutzer bereits eine Mitgliedschaft gekauft hat, möchte man ihm möglicherweise keine Mitgliedschafts-Werbeanzeigen auf eigenen anderen Eigenschaften zeigen.
• Die Protected Audience API ermöglicht Entwicklern die Implementierung von interessenbasierten Werbegeschäften, nämlich Remarketing und benutzerdefinierte Zielgruppenanwendungen. Sie kann mehrere Gebote für Werbeflächen auswerten und die gewonnene Anzeige in einem <fencedframe> anzeigen.
• Die Private Aggregation API kann Daten von <fencedframe>s (stammend aus dem gemeinsamen Speichermedium oder der Protected Audience API) sammeln und zusammengefasste Berichte erstellen.

Wie funktionieren <fencedframe>s?

Wie oben erwähnt, kontrollieren Sie den Inhalt, der in einem <fencedframe> eingebettet ist, nicht direkt über reguläre Skripte.

Um festzulegen, welche Inhalte in einem <fencedframe> angezeigt werden, generiert eine verwendende API (wie Protected Audience oder Shared Storage) ein FencedFrameConfig-Objekt, das dann mittels JavaScript als Wert der HTMLFencedFrameElement.config-Eigenschaft des <fencedframe> gesetzt wird.

Das folgende Beispiel erhält eine FencedFrameConfig von einer Anzeigenauktion der Protected Audience API, die dann verwendet wird, um die gewonnene Anzeige in einem <fencedframe> darzustellen:

const frameConfig = await navigator.runAdAuction({
  // … auction configuration
  resolveToConfig: true,
});

const frame = document.createElement("fencedframe");
frame.config = frameConfig;

resolveToConfig: true muss in den runAdAuction()-Aufruf übergeben werden, um ein FencedFrameConfig-Objekt zu erhalten. Wenn resolveToConfig auf false gesetzt ist, wird die resultierende Promise zu einem undurchsichtigen URN (zum Beispiel urn:uuid:c36973b5-e5d9-de59-e4c4-364f137b3c7a) aufgelöst, das nur in einem <iframe> verwendet werden kann.

So oder so speichert der Browser eine URL, die den Zielort des einzubettenden Inhalts enthält — gemappt auf den undurchsichtigen URN oder die url-Eigenschaft von FencedFrameConfig. Der URL-Wert kann von JavaScript im einbettenden Kontext nicht gelesen werden.

Zugriff auf die Fenced Frame-Funktionalität im Fence-Objekt

In Dokumenten, die in <fencedframe>s eingebettet sind, hat JavaScript Zugriff auf eine Window.fence-Eigenschaft, die eine Fence-Instanz für dieses Dokument zurückgibt. Dieses Objekt enthält mehrere Funktionen, die speziell für die Funktionalität der Fenced Frame API relevant sind. Zum Beispiel bietet Fence.reportEvent() eine Möglichkeit, die Übermittlung von Berichtsdaten über ein beacon an eine oder mehrere spezifizierte URLs auszulösen, um Anzeigendurchsichten und Klicks zu melden.

Berechtigungsrichtlinien

Nur spezifische Funktionen, die für die Nutzung in <fencedframe>s konzipiert sind, können über Berechtigungsrichtlinien aktiviert werden, die auf ihnen gesetzt werden; andere von Richtlinien gesteuerten Funktionen sind in diesem Kontext nicht verfügbar. Siehe Berechtigungsrichtlinien, die für Fenced Frames verfügbar sind für weitere Einzelheiten.

HTTP-Header

Ein Sec-Fetch-Dest-Header mit einem Wert von fencedframe wird für alle Anforderungen gesetzt, die von innerhalb eines <fencedframe> gemacht werden, einschließlich untergeordneter <iframe>s, die innerhalb eines <fencedframe> eingebettet sind.

Sec-Fetch-Dest: fencedframe

Der Server muss einen Supports-Loading-Mode-Antwortheader mit dem Wert fenced-frame setzen, für jedes Dokument, das in ein <fencedframe> oder in ein innerhalb eines <fencedframe> eingebettetes <iframe> geladen werden soll.

Supports-Loading-Mode: fenced-frame

Andere Auswirkungen von Fenced Frames auf HTTP-Header sind wie folgt:

• Client-Hinweise vom Benutzer-Agent sind innerhalb von Fenced Frames nicht verfügbar, da sie auf Berechtigungsrichtlinien-Delegierungen beruhen, die zur Datenweitergabe genutzt werden könnten.
• Strenge Cross-Origin-Opener-Policy-Einstellungen werden auf neue Browsing-Kontexte angewendet, die von innerhalb von Fenced Frames geöffnet werden, da sie ansonsten zur Informationsweitergabe an andere Ursprünge genutzt werden könnten. Jedes neue Fenster, das von innerhalb eines Fenced Frame geöffnet wird, hat rel="noopener" und Cross-Origin-Opener-Policy: same-origin gesetzt, um sicherzustellen, dass Window.opener null zurückgibt und es in seiner eigenen Browsing-Kontextgruppe platziert wird.
• Content-Security-Policy: fenced-frame-src wurde hinzugefügt, um gültige Quellen für geschachtelte Browsing-Kontexte anzugeben, die in <fencedframe>-Elementen geladen werden.
• Content-Security-Policy: sandbox benutzerdefinierte Einstellungen können von Fenced Frames nicht geerbt werden, um Privatsphärenprobleme zu mindern. Damit ein Fenced Frame lädt, dürfen Sie keine sandbox-CSP angeben (was die unten stehenden Werte impliziert) oder die folgenden Sandbox-Werte angeben:
  • allow-same-origin
  • allow-forms
  • allow-scripts
  • allow-popups
  • allow-popups-to-escape-sandbox
  • allow-top-navigation-by-user-activation

beforeunload und unload-Ereignisse

beforeunload- und unload-Ereignisse werden auf Fenced Frames nicht ausgelöst, da sie Informationen in Form eines Seitenlöschungszeitstempels weitergeben können. Implementierungen zielen darauf ab, so viele potenzielle Lecks wie möglich zu eliminieren.

Schnittstellen

FencedFrameConfig

Repräsentiert die Navigation eines <fencedframe>, d.h. den Inhalt, der darin angezeigt wird. Ein FencedFrameConfig wird von einer Quelle wie der Protected Audience API zurückgegeben und als Wert von HTMLFencedFrameElement.config festgelegt.

Fence

Enthält mehrere Funktionen, die für die Funktionalität von Fenced Frames relevant sind. Verfügbar nur für Dokumente, die innerhalb eines <fencedframe> eingebettet sind.

HTMLFencedFrameElement

Repräsentiert ein <fencedframe>-Element in JavaScript und bietet Eigenschaften zu dessen Konfiguration.

Erweiterungen zu anderen Schnittstellen

Navigator.deprecatedReplaceInURN()

Ersetzt spezifische Zeichenfolgen innerhalb der gemappten URL, die einem gegebenen undurchsichtigen URN oder der internen url-Eigenschaft von FencedFrameConfig entspricht.

Window.fence

Gibt eine Fence-Objektinstanz für den aktuellen Dokumentkontext zurück. Nur verfügbar für Dokumente, die innerhalb eines <fencedframe> eingebettet sind.

Einschreibung und lokales Testen

Bestimmte API-Funktionen, die FencedFrameConfigs erstellen, wie Navigator.runAdAuction() (Protected Audience API) und WindowSharedStorage.selectURL() (Shared Storage API), sowie andere Funktionen wie Fence.reportEvent(), erfordern, dass Sie Ihre Website in einem Privatsphären-Sandbox-Einschreibungsprozess registrieren. Wenn Sie dies nicht tun, schlagen die API-Aufrufe mit einer Konsolenwarnung fehl.

Beispiele

Die folgenden Demos nutzen alle <fencedframe>s:

• Shared Storage API-Demos (die auch einige Beispiele für die Private Aggregation API enthalten)
• Protected Audience API-Demo

Spezifikationen

Standards-Positionen

Ein Browser-Anbieter lehnt diese Spezifikation ab. Bekannte Standards-Positionen sind wie folgt:

• Mozilla (Firefox): Negativ

Browser-Kompatibilität

Siehe auch

• Fenced Frames auf privacysandbox.google.com
• The Privacy Sandbox auf privacysandbox.google.com