Demo dell'API Topics

Fai delle prove e scopri come gli argomenti vengono dedotti dai nomi host con una configurazione minima.

Stato implementazione

La demo dell'API Topics offre un'occhiata a come gli argomenti vengono dedotti dai nomi host. Puoi visualizzare un'anteprima degli argomenti osservati quando visiti un sito demo, che richiede pochissima configurazione.

La nostra demo è un'anteprima che illustra la maggior parte delle funzionalità dell'API Topics, per consentirti di acquisire familiarità con l'implementazione dell'API.

Puoi anche eseguire il colab Topics per provare il modello di classificatore Topics.

Il seguente video mostra come funziona la demo.

Esegui test con chrome://flags o flag di funzionalità

Esistono due modi per provare l'API Topics come singolo utente; devi avere Chrome 101 o versioni successive:

  • Attiva tutte le API di privacy per gli annunci in chrome://settings/adPrivacy.

  • Esegui Chrome dalla riga di comando con i seguenti flag:

    --enable-features=BrowsingTopics,BrowsingTopicsParameters:time_period_per_epoch/15s/browsing_topics_max_epoch_introduction_delay/3s,PrivacySandboxAdsAPIsOverride,PrivacySandboxSettings3,OverridePrivacySandboxSettingsLocalTesting

Demo dell'API Topics

La demo Topics mostra come utilizzare flag aggiuntivi per regolare impostazioni, come la durata dell'epoca. Se accedi all'API Topics eseguendo Chrome con i flag della riga di comando, non impostare chrome://flags, poiché questi possono sostituire le impostazioni della riga di comando.

Esegui Chromium con flag spiega come impostare i flag durante l'esecuzione di Chrome e di altri browser basati su Chromium dalla riga di comando, anche se questa demo è specifica per Google Chrome.

Demo delle intestazioni dell'API Topics

La demo all'indirizzo topics-fetch-demo.glitch.me mostra come utilizzare le intestazioni di richiesta e risposta fetch() per accedere agli argomenti e contrassegnarli come osservati.

Accedi all'intestazione della richiesta Sec-Browsing-Topics

Anziché utilizzare document.browsingTopics() da un iframe per visualizzare gli argomenti di un utente, i chiamanti dell'API possono accedere agli argomenti osservati dall'intestazione della richiesta Sec-Browsing-Topics di una richiesta fetch() che include {browsingTopics: true} nel parametro delle opzioni o dalla stessa intestazione di una richiesta XHR che imposta l'attributo deprecatedBrowsingTopics su true.

Ad esempio:

fetch('https://topics-server.glitch.me', {browsingTopics: true})
    .then((response) => {
        // Process the response
 })

Nei browser che supportano l'API, la richiesta fetch() includerà un'intestazione Sec-Browsing-Topics che elenca gli argomenti osservati per il nome host dell'URL della richiesta: in questo esempio, topics-server.glitch.me.

Se non sono stati osservati argomenti per questo nome host e questo utente, l'intestazione è inclusa, ma il valore è vuoto. In altre parole, l'intestazione Sec-Browsing-Topics in una richiesta fetch() include solo gli argomenti che sono stati osservati per il browser dell'utente corrente da un chiamante la cui origine corrisponde al nome host dell'URL della richiesta. È come se chiamassi document.browsingTopics() da un iframe per visualizzare gli argomenti osservati per l'utente corrente.

L'intestazione della richiesta viene inviata per una richiesta a condizione che siano utilizzati i criteri di autorizzazione appropriati, che il contesto sia sicuro e che le impostazioni utente lo consentano. Gli argomenti non vengono forniti nelle intestazioni per le richieste di navigazione.

L'intestazione della richiesta Topics ha il seguente aspetto:

Sec-Browsing-Topics: 186;version="chrome.1:1:2206021246";config_version="chrome.1";model_version="2206021246";taxonomy_version="1", 265;version="chrome.1:1:2206021246";config_version="chrome.1";model_version="2206021246";taxonomy_version="1"

Questo esempio include due argomenti della tassonomia degli argomenti, 186 e 265, insieme alle informazioni sulla versione di ogni argomento.

L'inclusione dell'intestazione degli argomenti nelle richieste XHR è disponibile solo temporaneamente e il supporto verrà rimosso in futuro.

Contrassegna gli argomenti come osservati con Observe-Browsing-Topics

Se una richiesta include un'intestazione Sec-Browsing-Topics e la risposta alla richiesta include un'intestazione Observe-Browsing-Topics: ?1, gli argomenti dell'intestazione della richiesta verranno contrassegnati dal browser in base a quanto osservato. Gli argomenti osservati sono idonei per il calcolo tramite l'API Topics. Questo meccanismo è progettato per corrispondere alla funzionalità fornita utilizzando l'API JavaScript da un iframe.

Il seguente screenshot mostra gli argomenti registrati dalla visita ai siti nella pagina demo dell'API.

Pagina demo dell'API Topics su glitch.me
La demo di glitch.me per provare l'API.

Questo elenco mostra i siti che puoi visitare dalla demo per registrare gli argomenti di interesse. Come puoi vedere, la categoria Arti e intrattenimento/Umorismo nello screenshot non è l'argomento di uno di questi siti web, quindi l'argomento registrato è quello che è stato aggiunto come possibile argomento casuale del 5%.

  • pets-animals-pets-cats.glitch.me
  • cats-cats-cats-cats.glitch.me
  • cats-pets-animals-pets.glitch.me
  • cats-feline-meow-purr-whiskers-pet.glitch.

Puoi controllare quali argomenti sono reali e quali casuali nella scheda Stato degli argomenti della pagina chrome://topics-internals. Questo screenshot mostra un esempio di diverse sessioni di navigazione.

La scheda Stato argomenti fornisce informazioni sugli argomenti osservati.
Scheda Stato degli argomenti che mostra argomenti reali e casuali.

Passaggi successivi

Se sei uno sviluppatore di ad tech, sperimenta e partecipa con l'API Topics. Leggi la guida per gli sviluppatori per accedere a risorse più approfondite.

Interagisci e condividi il tuo feedback