<fencedframe>: Das Fenced Frame-Element

Dieses Element umfasst die globalen Attribute.

allow Experimentell

Gibt eine Berechtigungsrichtlinie für das <fencedframe> an, die definiert, welche Funktionen dem <fencedframe> basierend auf dem Ursprung der Anfrage zur Verfügung stehen. Weitere Details, welche Funktionen über eine auf einem fenced frame gesetzte Richtlinie gesteuert werden können, finden Sie unter Berechtigungsrichtlinien für fenced frames.

height Experimentell

Ein ganzzahliger Wert ohne Einheit, der die Höhe des fenced frames in CSS-Pixeln darstellt. Der Standardwert ist 150.

width Experimentell

Ein ganzzahliger Wert ohne Einheit, der die Breite des fenced frames in CSS-Pixeln darstellt. Der Standardwert ist 300.

Berechtigungen, die vom obersten Kontext an ein fenced frame delegiert werden, um Funktionen zu erlauben oder zu verweigern, könnten als Kommunikationskanal genutzt werden und stellen daher eine Datenschutzbedrohung dar. Daher sind standardmäßige Webfunktionen, deren Verfügbarkeit über eine Berechtigungsrichtlinie gesteuert werden kann (zum Beispiel, camera oder geolocation), nicht verfügbar innerhalb von fenced frames.

Die einzigen Funktionen, die durch eine Richtlinie innerhalb von fenced frames aktiviert werden können, sind spezifische Funktionen, die dafür ausgelegt sind, innerhalb von fenced frames verwendet zu werden:

• Protected Audience API
  • attribution-reporting
  • private-aggregation
  • shared-storage
  • shared-storage-select-url
• Shared Storage API
  • attribution-reporting
  • private-aggregation
  • shared-storage
  • shared-storage-select-url

Derzeit sind diese immer innerhalb von fenced frames aktiviert. In Zukunft wird steuerbar sein, welche davon aktiviert sind, indem das <fencedframe> allow-Attribut verwendet wird. Das Blockieren von Funktionen der Privacy Sandbox auf diese Weise wird auch das Laden des fenced frames blockieren – es wird überhaupt keinen Kommunikationskanal geben.

Die Möglichkeit, den aktiven Fokus des Dokuments über fenced frame-Grenzen hinweg zu verschieben (d.h. von einem Element außerhalb des fenced frames zu einem innerhalb oder umgekehrt), ist begrenzt. Benutzerinitiierte Aktionen wie ein Klick oder ein Tab können dies tun, da hier kein Fingerabdruckrisiko besteht.

Der Versuch, die Grenze über einen API-Aufruf wie HTMLElement.focus() zu überschreiten, ist jedoch untersagt – ein bösartiges Skript könnte eine Reihe solcher Aufrufe verwenden, um abgeleitete Informationen über die Grenze hinweg zu leaken.

Als ein ersetztes Element erlaubt das <fencedframe>, die Position des eingebetteten Dokuments innerhalb seines Rahmens mit der Eigenschaft object-position zu justieren.

Die Größe des eingebetteten Inhalts kann durch interne contentWidth und contentHeight Eigenschaften des config Objekts des <fencedframe> festgelegt werden. In solchen Fällen wird das Ändern der width oder height des <fencedframe> die Größe des eingebetteten Containers auf der Seite ändern, jedoch wird das Dokument innerhalb des Containers visuell angepasst, um zu passen. Die gemeldete Breite und Höhe des eingebetteten Dokuments (d.h. Window.innerWidth und Window.innerHeight) bleibt unverändert.

Personen, die mit unterstützender Technologie navigieren, wie z. B. einem Screenreader, können das title-Attribut auf einem <fencedframe> verwenden, um dessen Inhalt zu kennzeichnen. Der Wert des Titels sollte den eingebetteten Inhalt kurz beschreiben:

<fencedframe
  title="Advertisement for new Log. From Blammo!"
  width="640"
  height="320"></fencedframe>

Ohne diesen Titel müssen sie in das <fencedframe> navigieren, um festzustellen, was sein eingebetteter Inhalt ist. Dieser Kontextwechsel kann verwirrend und zeitraubend sein, insbesondere für Seiten mit mehreren <fencedframe>s und/oder wenn Einbettungen interaktive Inhalte wie Video oder Audio enthalten.

Um festzulegen, welcher Inhalt in einem <fencedframe> angezeigt wird, generiert eine nutzende API (wie Protected Audience oder Shared Storage) ein FencedFrameConfig Objekt, welches dann als Wert der config-Eigenschaft des <fencedframe> gesetzt wird.

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

<fencedframe width="640" height="320"></fencedframe>

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

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

Note: resolveToConfig: true muss in den runAdAuction() Aufruf übergeben werden, um ein FencedFrameConfig-Objekt zu erhalten. Wenn es nicht gesetzt ist, wird die resultierende Promise zu einem URN aufgelöst, der nur in einem <iframe> verwendet werden kann.

• Fenced Frame API
• Fenced frames auf privacysandbox.google.com
• Die Privacy Sandbox auf privacysandbox.google.com