Eseguire il rendering di un annuncio

Quando un'asta Protected Audience restituisce un candidato annuncio, questo può essere restituito come URN opaco, che viene utilizzato per il rendering di un annuncio in un iframe, oppure come FencedFrameConfig, che viene utilizzato per il rendering dell'annuncio in un frame isolato.

Questa guida spiega cos'è un frame recintato e perché è necessario, nonché come eseguire il rendering di un annuncio utilizzando uno dei due metodi. Per un'analisi più approfondita dei frame con recinzione, consulta questa guida o la proposta.

Che cosa sono i frame isolati?

Un fenced frame (<fencedframe>) è un elemento HTML per i contenuti incorporati, simile a un iframe. A differenza degli iframe, un frame recintato limita la comunicazione con il contesto di incorporamento per consentire al frame di accedere ai dati tra siti senza condividerli con il contesto di incorporamento. Analogamente, i dati proprietari nel contesto di incorporamento non possono essere condivisi con il fenced frame.

Ad esempio, supponiamo che news.example (il contesto di incorporamento) incorpori un annuncio di shoes.example in un frame isolato. news.example non può estrarre dati dall'annuncio shoes.example e shoes.example non può apprendere dati proprietari da news.example.

Come funzionano i frame recintati?

I frame recintati utilizzano l'oggetto FencedFrameConfig per la navigazione. Questo oggetto può essere restituito da un'asta Protected Audience. Successivamente, l'oggetto di configurazione viene impostato come attributo config nell'elemento frame recintato. che si differenzia da un iframe in cui un URL o un URN opaco viene assegnato all'attributo src. L'oggetto FencedFrameConfig ha una proprietà url di sola lettura; tuttavia, poiché i casi d'uso attuali richiedono che l'URL effettivo della risorsa interna sia nascosto, questa proprietà restituisce la stringa opaca quando viene letta.

Un frame recintato non può utilizzare postMessage per comunicare con il suo incorporatore. Tuttavia, un frame recintato può utilizzare postMessage con iframe all'interno del frame recintato.

I fenced frame verranno isolati dal publisher in altri modi. L'editore non avrà accesso al DOM all'interno di un frame recintato e il frame recintato non potrà accedere al DOM dell'editore. Inoltre, attributi come name, che possono essere impostati su qualsiasi valore e osservati dal publisher, non sono disponibili nei frame isolati.

I fenced frame si comportano come un contesto di navigazione di primo livello (ad esempio una scheda del browser). Sebbene un frame recintato in determinati casi d'uso (ad esempio opaque-ads) possa contenere dati cross-site (ad esempio un gruppo di interesse dell'API Protected Audience), il frame non può accedere a cookie o spazio di archiviazione non partizionato. Un frame recintato opaque-ads può accedere a una partizione di archiviazione e cookie univoca basata su nonce.

Le caratteristiche dei fenced frame sono descritte in modo più dettagliato nell'explainer.

Eseguire il rendering di un annuncio in un frame protetto

Un FencedFrameConfig viene restituito da un'asta Protected Audience, a condizione che il parametro resolveToConfig di AuctionConfig sia stato impostato su true:

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

Una volta ottenuta la configurazione, puoi assegnarla all'attributo config di un frame recintato per spostare il frame alla risorsa rappresentata dalla configurazione. Le versioni precedenti di Chrome non supportano la proprietà resolveToConfig, quindi devi comunque verificare che la promessa sia stata risolta in un FencedFrameConfig prima di navigare:

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

Eseguire il rendering di un annuncio in un iframe

Se AuctionConfig non imposta esplicitamente resolveToConfig o se è impostato su false, runAdAuction() restituisce un URN opaco. Questo URN può essere impostato come iframe di src per il rendering dell'annuncio.