顯示廣告

Protected Audience 競價傳回候選廣告時,可以是 以不透明 URN 形式傳回,用於在 iframe 中顯示廣告。 FencedFrameConfig,用於在圍欄頁框中顯示廣告。

本指南將說明何謂圍欄框架、為何需要,以及 如何以任一方法顯示廣告想深入瞭解圍欄 請參閱這份指南提案瞭解詳情。

什麼是圍欄框架?

圍欄頁框 (<fencedframe>) 是嵌入內容的 HTML 元素, 類似 iframe。有別於 iframe,圍欄框架會限制通訊 以便框架存取跨網站資料,而不需要 並透過嵌入內容共用該資源同樣地, 也無法與 Fenced Frame 共用。

舉例來說,假設 news.example (嵌入結構定義) 從以下位置嵌入廣告: shoes.example。「news.example」無法從以下來源竊取資料: 「shoes.example」廣告,以及「shoes.example」無法從 news.example

圍欄影格如何運作?

Fenced Frame 會使用 FencedFrameConfig 物件進行導覽。這個物件可以 如何從 Protected Audience 競價傳回然後將 config 物件設為 Fenced frame 元素上的 config 屬性。這與iframe不同 ,系統會將網址或不透明的 URN 指派給 src 屬性。 FencedFrameConfig 物件具有唯讀 url 屬性;不過,由於 根據目前的使用情形,必須隱藏內部資源的實際網址 此屬性會在讀取時傳回不透明字串。

Fenced Frame 無法使用 postMessage 與嵌入器通訊。 然而,圍欄框架可以使用 postMessage,其內部的 iframe 圍欄。

Fenced Frame 會以其他方式與發布商區隔。發布商 無法存取圍欄頁框中的 DOM,而圍欄頁框 無法存取發布商的 DOM。此外,name 這類屬性可以 設為發布商所觀察的任何值,不適用於圍欄 相輔相成。

Fenced Frame 的運作方式與頂層瀏覽環境 (例如瀏覽器) 類似 分頁)。雖然在某些用途 (例如 opaque-ads) 中使用圍欄框架 包含跨網站資料 (例如 Protected Audience API 興趣群組) 框架無法存取未分區的儲存空間或 Cookie。opaque-ads 圍欄 可存取不重複的 Nonce Cookie 和儲存空間分區。

如要進一步瞭解圍欄框架的特性,請參閱這份說明

在圍欄頁框中顯示廣告

系統會從 Protected Audience 競價傳回 FencedFrameConfig AuctionConfigs resolveToConfig 參數設為 true:

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

取得設定後,即可將其指派給圍欄框架的 config 屬性,前往設定代表的資源。 舊版 Chrome 不支援 resolveToConfig 屬性,因此您將 仍必須事先確認提案是否已解決 FencedFrameConfig 導覽:

if (window.FencedFrameConfig && frameConfig instanceof FencedFrameConfig) {
  const frame = document.createElement('fencedframe');
  frame.config = frameConfig;
}

在 iframe 中顯示廣告

如果 AuctionConfig 未明確設定 resolveToConfig 或已設定 設為 false,runAdAuction() 會傳回不透明 URN。這個 URN 可設為 「iframe」的 src,以便顯示廣告。