Incorpora in modo sicuro i contenuti in una pagina senza condividere dati tra siti.
Stato implementazione
Questo documento illustra un nuovo elemento HTML: <fencedframe>
.
- La proposta Fenced Frames è ora in disponibilità generale.
- Stato della piattaforma Chrome
Proposal | Status |
---|---|
Web API changes for urn to config Explainer |
Available in Chrome in Q1 2023. |
Creative Macros in Fenced Frames for Ads Reporting (FFAR) GitHub Issue |
Available in Chrome in Q3 2023. |
Send Automatic Beacons Once GitHub Issue |
Available in Chrome in Q3 2023. |
Serializable Fenced Frames Configs GitHub Issue |
Available in Chrome in Q3 2023. |
Additional Format Option for Protected Audience Ad Size Macros GitHub Issue |
Available in Chrome in Q4 2023. |
Automatic beacons sending to all registered URLs GitHub Issue | GitHub Issue |
Available in Chrome in Q4 2023. |
Enable Leaving Ad Interest Groups from Urn iFrames and Ad Component Frames
GitHub issue |
Available in Chrome in Q1 2024 |
Introduce reserved.top_navigation_start/commit
GitHub issue, GitHub issue |
Available in Chrome in Q1 2024 |
Do Not Disable Cookie Setting in ReportEvent until 3PCD
GitHub issue |
Available in Chrome in Q1 2024 |
Add support for automatic beacons in cross-origin subframes
GitHub issue |
Available in Chrome in Q1 2024 |
Perché sono necessari frame recintati?
Un frame recintato (<fencedframe>
) è un elemento HTML per i contenuti incorporati
simili a quelli di un iframe. A differenza degli iframe, un frame recintato limita
la comunicazione con il suo contesto di incorporamento per consentire al frame di accedere
i dati senza condividerli con il contesto di incorporamento. Alcune API Privacy Sandbox
potrebbe richiedere una selezione di documenti da visualizzare all'interno di un frame recintato.
Allo stesso modo, i dati proprietari nel contesto di incorporamento non possono essere condivisi con il frame recintato.
Ad esempio, supponiamo che news.example
(il contesto di incorporamento) incorpora un annuncio da
shoes.example
in un frame recintato. news.example
non può esfiltrare i dati da
l'annuncio shoes.example
e shoes.example
non può apprendere i dati proprietari
news.example
.
Rafforza la privacy tra siti con il partizionamento dello spazio di archiviazione
Mentre navighi sul web, probabilmente hai guardato prodotti su un sito e poi lo hai visto riapparire in un annuncio su un sito completamente diverso.
Oggi, questa tecnica pubblicitaria si ottiene principalmente attraverso il monitoraggio tecnologia che utilizza cookie di terze parti per condividere informazioni tra siti. Questo è la tecnologia che Chrome si è impegnata a mettere in e sostituirli con varianti che tutelano maggiormente la privacy.
Chrome sta lavorando sullo spazio di archiviazione
il partizionamento orizzontale,
separa l'archiviazione del browser per sito. Attualmente, se un iframe di shoes.example
è incorporato in news.example
e quell'iframe archivia un valore nello spazio di archiviazione,
questo valore potrà essere letto dal sito di shoes.example
. Dopo che lo spazio di archiviazione
partizionati tra siti non condividono più lo spazio di archiviazione, pertanto
shoes.example
non sarà in grado di accedere alle informazioni memorizzate dall'iframe. Se
l'iframe viene pubblicato da *.shoes.example
e incorporato su
*.shoes.example
, lo spazio di archiviazione del browser verrà condiviso poiché è considerato stesso sito.
![Un confronto tra lo stato precedente e dopo il partitino dello spazio di archiviazione.](https://developers-dot-devsite-v2-prod.appspot.com/static/privacy-sandbox/assets/images/a-comparison-before-aft-4902b6c89fcb5.png?authuser=9&hl=it)
Il partizionamento dello spazio di archiviazione verrà applicato alle API di archiviazione standard, tra cui LocalStorage, IndexedDB e i cookie. In un mondo partizionato, le informazioni le perdite nello spazio di archiviazione proprietario saranno significativamente ridotte.
Lavora con i dati cross-site
I frame recintati è una funzionalità di Privacy Sandbox il che suggerisce che i siti di primo livello devono eseguire il partizionamento dei dati. Molti Privacy Sandbox proposte e API mirano a soddisfare casi d'uso tra siti senza cookie di terze parti altri meccanismi di monitoraggio. Ad esempio:
- L'API Protected Audience consente la pubblicazione di annunci basati sugli interessi in modo da garantire la tutela della privacy.
- Lo spazio di archiviazione condiviso ti consente accesso a dati tra siti non partizionati in un ambiente sicuro.
Vediamo come potrebbero funzionare i frame recintati con API Protected Audience. Con l'API Protected Audience, gli interessi di un utente Siano registrati sul sito di un inserzionista nel suo interesse gruppi, insieme agli annunci che può essere di interesse per l'utente. Quindi, su un sito separato (noto come "publisher"), gli annunci registrati nei gruppi di interesse pertinenti vengono venduti all'asta e l'annuncio vincente viene visualizzato in un frame recintato.
Se il publisher visualizza l'annuncio vincente in un iframe e lo script può leggere
attributo src
di iframe, il publisher può dedurre informazioni sul
interessi dall'URL di tale annuncio. Questa procedura non tutela la privacy.
Con un frame recintato, il publisher può mostrare un annuncio che corrisponde al
interessi, ma src
e il gruppo basato sugli interessi saranno noti solo all'inserzionista
nell'inquadratura. L'editore non è riuscito ad accedere a queste informazioni.
Come funzionano i frame recintati?
I frame bloccati utilizzano l'oggetto FencedFrameConfig
per la navigazione. Questo oggetto può essere restituito da un'asta dell'API Protected Audience o da un'operazione di selezione dell'URL di Archiviazione condivisa. L'oggetto di configurazione viene quindi impostato come attributo config
nell'elemento frame recintato. È diverso da un iframe in cui all'attributo src
viene assegnato un URL oppure un elemento URN opaco. 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 opaque
quando viene letta.
Un frame recintato non può utilizzare postMessage
per comunicare con l'incorporatore. Tuttavia, un frame recintato può utilizzare postMessage
con iframe all'interno del frame recintato.
I frame protetti verranno isolati dal publisher in altri modi. Ad esempio
il publisher non avrà accesso al DOM all'interno di un frame recintato e
il frame recintato non può accedere al DOM del publisher. Inoltre, attributi come
name
, che può essere impostato su qualsiasi valore e può essere osservato dal
publisher, non sono disponibili in frame protetti.
I frame recintati si comportano come una navigazione di primo livello
contesto
(come una scheda del browser). Sebbene sia un frame recintato in determinati casi d'uso
(ad esempio opaque-ads
) possono contenere dati cross-site (ad esempio un interesse nell'API Protected Audience
il frame non può accedere allo spazio di archiviazione non partizionato o ai cookie. Un
opaque-ads
frame recintato può accedere a uno spazio di archiviazione e a un cookie unici non basati su nonce
della partizione di testo.
Le caratteristiche dei frame recintati sono descritte in dettaglio nella sezione spiegazione.
Qual è la differenza tra i frame protetti e gli iframe?
Ora che sai quali frame bloccati funzionano o meno, è utile confrontare alle funzioni iframe esistenti.
Funzionalità | iframe |
fencedframe |
---|---|---|
Incorporare contenuti | Sì | Sì |
I contenuti incorporati possono accedere al DOM del contesto di incorporamento | Sì | No |
Il contesto di incorporamento può accedere al DOM dei contenuti incorporati | Sì | No |
Attributi osservabili, come name |
Sì | No |
URL (http://example.com ) |
Sì | Sì (in base al caso d'uso) |
Origine opaca gestita dal browser (urn:uuid ) |
No | Sì |
Accesso ai dati tra siti | No | Sì (in base al caso d'uso) |
I frame recintati supportano meno opzioni di comunicazione esterna per tutelare la privacy.
I frame recintati sostituiranno gli iframe?
In definitiva, i frame recintati non sostituiranno gli iframe e non dovrai utilizzarli. I frame protetti sono un frame più privato per l'uso quando i dati sulla stessa pagina devono essere visualizzate partizioni di primo livello diverse.
Gli iframe dello stesso sito (a volte noti come iframe semplici) sono considerati attendibili contenuti.
Usa frame recintati
I frame recintati funzioneranno in combinazione con altre API Privacy Sandbox per visualizzare documenti di diverse partizioni di archiviazione all'interno di un'unica pagina. Al momento sono in discussione potenziali API.
Gli attuali candidati per questa combinazione includono:
- Della famiglia dell'API TURTLEDOVE (ovvero base per l'API Protected Audience), i frame recintati potrebbero funzionare con Impatto sulle conversioni Misurazione utilizzando Spazio di archiviazione condiviso.
- Un'altra opzione è consentire ai frame recintati di essere sola lettura o accesso non partizionato spazio di archiviazione.
Per ulteriori dettagli, consulta la sezione Cornici recintati esplicativa dei casi d'uso.
Esempi
Per ottenere un oggetto frame config
recintato, devi passare resolveToConfig: true
alla chiamata runAdAuction()
dell'API Protected Audience o alla chiamata selectURL()
di Archiviazione condivisa. Se la proprietà non viene aggiunta (o è impostata su false
), la promessa risultante verrà risolta in un URN che può essere utilizzato solo in un iframe.
const frameConfig = await navigator.runAdAuction({ // ...auction configuration resolveToConfig: true });
const frameConfig = await sharedStorage.selectURL('operation-name', { resolveToConfig: true });
Dopo aver ottenuto la configurazione, puoi assegnarla all'attributo config
di un frame recintato per passare alla risorsa rappresentata dalla configurazione nel frame. Le versioni precedenti di Chrome non supportano la proprietà resolveToConfig
, quindi devi comunque confermare che la promessa è stata risolta a FencedFrameConfig
prima di navigare:
if (window.FencedFrameConfig && frameConfig instanceof FencedFrameConfig) { const frame = document.createElement('fencedframe'); frame.config = frameConfig; }
Per scoprire di più, consulta i video esplicativi Frame schermati e Configurazione di frame schermati.
Intestazioni
I browser imposteranno Sec-Fetch-Dest: fencedframe
per le richieste effettuate da frame e iframe incorporati all'interno di un frame recintato.
Sec-Fetch-Dest: fencedframe
Il server deve impostare l'intestazione della risposta Supports-Loading-Mode: fenced-frame
affinché un documento venga caricato in un frame recintato. L'intestazione deve essere presente anche in eventuali iframe all'interno di un frame recintato.
Supports-Loading-Mode: fenced-frame
Contesto dello spazio di archiviazione condiviso
Ti consigliamo di utilizzare l'aggregazione privata per generare report sui dati a livello di evento in frame protetti associati ai dati contestuali dell'incorporamento. Utilizzando il metodo fencedFrameConfig.setSharedStorageContext()
, puoi trasmettere alcuni dati contestuali, ad esempio un ID evento, dall'utente che ha eseguito l'incorporamento ai worklet dello spazio di archiviazione condiviso avviati dall'API Protected Audience.
Nel seguente esempio, vengono memorizzati alcuni dati disponibili nella pagina dell'incorporamento e alcuni dati disponibili nel frame protetto nello spazio di archiviazione condiviso. Dalla pagina dell'incorporamento, viene impostato un ID evento fittizio come contesto dello spazio di archiviazione condiviso. Dal frame recintato vengono trasmessi i dati dell'evento frame.
Dalla pagina dell'incorporamento, puoi impostare dati contestuali come contesto dello spazio di archiviazione condiviso:
const frameConfig = await navigator.runAdAuction({ resolveToConfig: true });
// Data from the embedder that you want to pass to the shared storage worklet
frameConfig.setSharedStorageContext('some-event-id');
const frame = document.createElement('fencedframe');
frame.config = frameConfig;
Dal frame recintato, puoi passare i dati a livello di evento dal frame al worklet dello spazio di archiviazione condiviso (non correlati ai dati contestuali dell'incorporamento precedente):
const frameData = {
// Data available only inside the fenced frame
}
await window.sharedStorage.worklet.addModule('reporting-worklet.js');
await window.sharedStorage.run('send-report', {
data: {
frameData
},
});
Puoi leggere le informazioni contestuali dell'incorporamento da sharedStorage.context
e i dati a livello di evento del frame dall'oggetto data
, quindi segnalarli tramite l'aggregazione privata:
class ReportingOperation {
convertEventIdToBucket(eventId) { ... }
convertEventPayloadToValue(info) { ... }
async run(data) {
// Data from the embedder
const eventId = sharedStorage.context;
// Data from the fenced frame
const eventPayload = data.frameData;
privateAggregation.contributeToHistogram({
bucket: convertEventIdToBucket(eventId),
value: convertEventPayloadToValue(eventPayload)
});
}
}
register('send-report', ReportingOperation);
Per saperne di più sul contesto dell'incorporamento in un oggetto di configurazione di frame recintati, consulta la spiegazione.
Prova frame recintati
Utilizza Chrome
di sicurezza per
abilita l'API Fenced Frame in chrome://flags/#enable-fenced-frames
.
![In Chrome Experiments, imposta Attivato per il flag denominato Attiva l'elemento frame fenced](https://developers-dot-devsite-v2-prod.appspot.com/static/privacy-sandbox/assets/images/in-chrome-experiments-se-46957b7b97eb3.png?authuser=9&hl=it)
Nella finestra di dialogo sono presenti più opzioni. Ti consigliamo vivamente di selezionare *Abilita*, che consente a Chrome di aggiornarsi automaticamente alla nuova architettura non appena diventano disponibili.
Le altre opzioni, Abilitata con ShadowDOM e Abilitata con più architettura della pagina, offrono diverse strategie di implementazione che sono per i tecnici dei browser. Attualmente, Attiva funziona come Abilitata con ShadowDOM. In futuro, Attiva verrà mappato ad Attiva con su più pagine.
Rilevamento delle caratteristiche
Per determinare se sono definiti frame recintati:
if (window.HTMLFencedFrameElement) {
// The fenced frame element is defined
}
Per determinare se è disponibile la configurazione di frame recintati:
js
if (window.FencedFrameConfig && frameConfig instanceof FencedFrameConfig) {
// The fenced frame config is available
}
Supporto browser
L'elemento <fencedframe>
è ancora in modalità sperimentale, quindi lo è attualmente
supportati da Chrome 97 e versioni successive. Al momento non è supportato da altri
browser supportati.
Interagisci e condividi il feedback
I frame protetti sono in fase di discussione attiva e sono soggetti a modifica in per il futuro. Se provi questa API e hai feedback, ci piacerebbe conoscere la tua opinione.
- GitHub: leggi la spiegazione, sollevare domande e seguire discussione.
- Assistenza per gli sviluppatori: poni domande e partecipa alle discussioni sul Assistenza per gli sviluppatori di Privacy Sandbox un repository attendibile.