Afficher une annonce

Lorsqu'une mise aux enchères Protected Audience renvoie une annonce candidate, celle-ci peut être renvoyée sous la forme d'un URN opaque, utilisé pour afficher une annonce dans un iframe, ou d'un FencedFrameConfig utilisé pour afficher l'annonce dans un frame cloisonné.

Ce guide explique ce qu'est un frame cloisonné, pourquoi il est nécessaire, et comment afficher une annonce à l'aide de l'une ou l'autre de ces méthodes. Pour en savoir plus sur les cadres cloisonnés, consultez ce guide ou la proposition.

Que sont les cadres cloisonnés ?

Un frame cloisonné (<fencedframe>) est un élément HTML de contenu intégré, semblable à un élément iframe. Contrairement aux iframe, une trame cloisonnée limite la communication avec son contexte d'intégration pour permettre à la trame d'accéder aux données intersites sans les partager avec le contexte d'intégration. De même, aucune donnée first party dans le contexte de représentation vectorielle continue ne peut être partagée avec le frame cloisonné.

Par exemple, supposons que news.example (le contexte d'intégration) intègre une annonce de shoes.example dans un frame cloisonné. news.example ne peut pas exfiltrer les données de l'annonce shoes.example, et shoes.example ne peut pas apprendre les données first party à partir de news.example.

Comment fonctionnent les cadres cloisonnés ?

Les Fenced Frames utilisent l'objet FencedFrameConfig pour la navigation. Cet objet peut être renvoyé à partir d'une mise aux enchères Protected Audience. Ensuite, l'objet de configuration est défini en tant qu'attribut config sur l'élément de cadre clôturé. Cela diffère d'un iframe dans lequel une URL ou un URN opaque est attribué à l'attribut src. L'objet FencedFrameConfig possède une propriété url en lecture seule. Toutefois, comme les cas d'utilisation actuels nécessitent que l'URL réelle de la ressource interne soit masquée, cette propriété renvoie la chaîne opaque lorsqu'elle est lue.

Une trame cloisonnée ne peut pas utiliser postMessage pour communiquer avec son outil d'intégration. Cependant, un frame cloisonné peut utiliser postMessage avec des iframe à l'intérieur du frame cloisonné.

Les cadres cloisonnés sont isolés de l'éditeur d'autres manières. L'éditeur n'aura pas accès au DOM à l'intérieur d'un frame cloisonné, qui ne pourra pas accéder au DOM de l'éditeur. De plus, les attributs tels que name, qui peuvent être définis sur n'importe quelle valeur et observés par l'éditeur, ne sont pas disponibles dans les cadres cloisonnés.

Les cadres cloisonnés se comportent comme un contexte de navigation de premier niveau (un onglet de navigateur, par exemple). Bien qu'un frame cloisonné dans certains cas d'utilisation (tels que opaque-ads) puisse contenir des données intersites (telles qu'un groupe de centres d'intérêt de l'API Protected Audience), le frame ne peut pas accéder au stockage ni aux cookies non partitionnés. Une trame clôturée opaque-ads peut accéder à une partition de stockage et de cookie unique basée sur un nonce.

Les caractéristiques des frames cloisonnés sont plus détaillées dans l'explication.

Afficher une annonce dans un frame cloisonné

Un FencedFrameConfig est renvoyé par une mise aux enchères Protected Audience, à condition que le paramètre resolveToConfig de AuctionConfig soit défini sur "true" :

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

Une fois la configuration obtenue, vous pouvez l'attribuer à l'attribut config d'un frame cloisonné pour accéder au frame jusqu'à la ressource représentée par la configuration. Les versions antérieures de Chrome ne sont pas compatibles avec la propriété resolveToConfig. Vous devez donc toujours confirmer que la promesse a été résolue en FencedFrameConfig avant de naviguer:

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

Afficher une annonce dans un iFrame

Si AuctionConfig ne définit pas explicitement resolveToConfig ou s'il est défini sur "false", runAdAuction() renvoie un URN opaque. Cet URN peut être défini en tant que src de iframe pour afficher l'annonce.