광고 렌더링

Protected Audience 입찰에서 광고 조합을 반환하면 iframe에서 광고를 렌더링하는 데 사용되는 불투명 URN 또는 분리 프레임에서 광고를 렌더링하는 데 사용되는 FencedFrameConfig로 반환될 수 있습니다.

이 가이드에서는 분리 프레임의 정의와 필요한 이유, 두 가지 방법 중 하나로 광고를 렌더링하는 방법을 설명합니다. 분리 프레임을 더 자세히 살펴보려면 이 가이드 또는 제안서에서 자세한 내용을 확인하세요.

분리 프레임이란 무엇인가요?

분리 프레임 (<fencedframe>)은 삽입된 콘텐츠의 HTML 요소로, iframe와 유사합니다. iframe와 달리 분리 프레임은 임베딩 컨텍스트와의 통신을 제한하여 프레임이 임베딩 컨텍스트와 공유하지 않고도 크로스 사이트 데이터에 액세스할 수 있도록 합니다. 마찬가지로 임베딩 컨텍스트의 모든 퍼스트 파티 데이터는 분리 프레임과 공유될 수 없습니다.

예를 들어 news.example (임베딩 컨텍스트)가 분리 프레임에 shoes.example의 광고를 삽입한다고 가정해 보겠습니다. news.exampleshoes.example 광고에서 데이터를 유출할 수 없으며 shoes.examplenews.example에서 퍼스트 파티 데이터를 학습할 수 없습니다.

분리 프레임은 어떻게 작동하나요?

분리 프레임은 탐색에 FencedFrameConfig 객체를 사용합니다. 이 객체는 Protected Audience 입찰에서 반환될 수 있습니다. 그런 다음 config 객체가 분리 프레임 요소에서 config 속성으로 설정됩니다. 이는 URL 또는 불투명 URN이 src 속성에 할당되는 iframe와 다릅니다. FencedFrameConfig 객체에는 읽기 전용 url 속성이 있습니다. 그러나 현재 사용 사례에서는 내부 리소스의 실제 URL을 숨겨야 하므로 이 속성은 읽을 때 불투명한 문자열을 반환합니다.

분리 프레임은 postMessage를 사용하여 임베드된 프레임과 통신할 수 없습니다. 그러나 분리 프레임은 분리 프레임 내의 iframe와 함께 postMessage를 사용할 수 있습니다.

분리 프레임은 다른 방식으로 게시자와 격리됩니다. 게시자는 분리 프레임 내부의 DOM에 액세스할 수 없으며 분리 프레임은 게시자의 DOM에 액세스할 수 없습니다. 또한 name와 같은 속성(값으로 설정될 수 있고 게시자가 관찰할 수 있음)은 분리 프레임에서 사용할 수 없습니다.

분리 프레임은 최상위 탐색 컨텍스트 (예: 브라우저 탭)처럼 동작합니다. 특정 사용 사례 (예: opaque-ads)의 분리 프레임에는 크로스 사이트 데이터 (예: Protected Audience API 관심분야 그룹)가 포함될 수 있지만 프레임은 파티션을 나누지 않은 저장소나 쿠키에 액세스할 수 없습니다. opaque-ads 분리 프레임은 고유한 nonce 기반 쿠키 및 스토리지 파티션에 액세스할 수 있습니다.

분리 프레임의 특성은 설명서에 자세히 설명되어 있습니다.

분리 프레임에서 광고 렌더링

FencedFrameConfigAuctionConfigresolveToConfig 매개변수가 true로 설정된 경우 Protected Audience 입찰에서 반환됩니다.

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에서 광고 렌더링

AuctionConfigresolveToConfig를 명시적으로 설정하지 않거나 false로 설정된 경우 runAdAuction()는 불투명 URN을 반환합니다. 이 URN을 iframesrc로 설정하여 광고를 렌더링할 수 있습니다.