Protected Audience オークションで広告候補が返される場合、iframe で広告をレンダリングするために使用される不透明な URN として返されるか、フェンス付きフレームで広告をレンダリングするために使用される FencedFrameConfig として返されます。
このガイドでは、フェンス付きフレームの概要と必要性、およびいずれかの方法で広告をレンダリングする方法について説明します。フェンス付きフレームについて詳しくは、こちらのガイドまたは提案をご覧ください。
フェンス付きフレームとは
フェンス付きフレーム(<fencedframe>)は、iframe と同様に、埋め込みコンテンツ用の HTML 要素です。iframe とは異なり、フェンス付きフレームは埋め込みコンテキストとの通信を制限し、埋め込みコンテキストと共有することなく、フレームがクロスサイト データにアクセスできるようにします。同様に、埋め込みコンテキストのファーストパーティ データは、フェンス付きフレームと共有できません。
たとえば、news.example(エンベディング コンテキスト)が shoes.example の広告をフェンス付きフレームに埋め込むとします。news.example は shoes.example 広告からデータを漏洩させることはできません。また、shoes.example は news.example からファーストパーティ データを学習することはできません。
フェンス付きフレームの仕組み
フェンス付きフレームは、ナビゲーションに FencedFrameConfig オブジェクトを使用します。このオブジェクトは、Protected Audience オークションから返されることがあります。次に、構成オブジェクトがフェンス付きフレーム要素の config 属性として設定されます。これは、URL または不透明な URN が src 属性に割り当てられる iframe とは異なります。FencedFrameConfig オブジェクトには読み取り専用の url プロパティがありますが、現在のユースケースでは内部リソースの実際の URL を非表示にする必要があるため、このプロパティは読み取られると文字列 opaque を返します。
フェンス付きフレームは postMessage を使用してエンベッダーと通信できません。ただし、フェンス付きフレームは、フェンス付きフレーム内の iframe で postMessage を使用できます。
フェンス付きフレームは、他の方法でもパブリッシャーから分離されます。パブリッシャーはフェンス付きフレーム内の DOM にアクセスできず、フェンス付きフレームはパブリッシャーの DOM にアクセスできません。また、name などの属性は、パブリッシャーが任意の値を設定して監視できますが、フェンス付きフレームでは使用できません。
フェンス付きフレームは、トップレベルのブラウジング コンテキスト(ブラウザタブなど)のように動作します。特定のユースケース(opaque-ads など)では、フェンス付きフレームにクロスサイト データ(Protected Audience API のインタレスト グループなど)を含めることができますが、フレームはパーティショニングされていないストレージや Cookie にアクセスできません。opaque-ads フェンス付きフレームは、一意の nonce ベースの Cookie とストレージ パーティションにアクセスできます。
フェンス付きフレームの特性については、説明で詳しく説明しています。
フェンス付きフレームで広告をレンダリングする
AuctionConfig の resolveToConfig パラメータが true に設定されている場合、Protected Audience オークションから FencedFrameConfig が返されます。
const frameConfig = await navigator.runAdAuction({
// ...auction configuration
resolveToConfig: true
});
構成を取得したら、フェンス付きフレームの config 属性に割り当てて、フレームを構成で表されるリソースに移動できます。以前のバージョンの Chrome では resolveToConfig プロパティがサポートされていないため、ナビゲーションの前に、Promise が FencedFrameConfig に解決されたことを確認する必要があります。
if (window.FencedFrameConfig && frameConfig instanceof FencedFrameConfig) {
const frame = document.createElement('fencedframe');
frame.config = frameConfig;
}
iframe で広告をレンダリングする
AuctionConfig が resolveToConfig を明示的に設定していない場合、または false に設定されている場合、runAdAuction() は不透明な URN を返します。この URN は、広告をレンダリングするために iframe の src として設定できます。