Demonstrações da API Topics

Teste e saiba como os temas são inferidos de nomes de host com configuração mínima.

Status da implementação

A demonstração da API Topics fornece uma visão de como os temas são inferidos de nomes de host. Você pode visualizar quais temas são observados ao visitar um site de demonstração, que requer pouquíssima configuração.

Nossa demonstração é uma prévia da maioria dos recursos da API Topics para você entender como ela é implementada.

Você também pode executar o Colab da API Topics para testar o modelo de classificador da API Topics.

O vídeo a seguir mostra como a demonstração funciona.

Testar com chrome://flags ou sinalizações de recursos

Há duas maneiras de testar a API Topics como um único usuário. É necessário executar o Chrome 101 ou mais recente:

  • Ative todas as APIs de privacidade de anúncios em chrome://settings/adPrivacy.

  • Execute o Chrome na linha de comando com as seguintes sinalizações:

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

Demonstração da API Topics

A demonstração da Topics mostra como usar flags adicionais para ajustar configurações, como a duração da época. Se você acessar a API Topics executando o Chrome com sinalizações de linha de comando, não defina chrome://flags, porque eles podem substituir as configurações da linha de comando.

Executar o Chromium com sinalizações explica como definir sinalizações ao executar o Google Chrome e outros navegadores baseados no Chromium a partir da linha de comando, embora esta demonstração seja específica para o Google Chrome.

Demonstração dos cabeçalhos da API Topics

A demonstração em topics-fetch-demo.glitch.me mostra como usar cabeçalhos de solicitação e resposta fetch() para acessar tópicos e marcá-los como observados.

Acessar o cabeçalho da solicitação Sec-Browsing-Topics

Em vez de usar o document.browsingTopics() de um iframe para conferir os temas de um usuário, os autores das chamadas de API podem acessar temas observados no cabeçalho de solicitação Sec-Browsing-Topics de uma solicitação fetch() que inclui {browsingTopics: true} no parâmetro de opções ou no mesmo cabeçalho de uma solicitação XHR que define o atributo deprecatedBrowsingTopics como true.

Exemplo:

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

Em navegadores compatíveis com a API, a solicitação fetch() inclui um cabeçalho Sec-Browsing-Topics que lista os tópicos observados no nome do host do URL da solicitação: neste exemplo, topics-server.glitch.me.

Se nenhum tópico for observado para esse nome de host e esse usuário, o cabeçalho será incluído, mas o valor ficará vazio. Em outras palavras, o cabeçalho Sec-Browsing-Topics em uma solicitação fetch() inclui apenas temas que foram observados no navegador do usuário atual por um autor da chamada com origem que corresponde ao nome do host do URL da solicitação. Isso é o mesmo que se você estivesse chamando document.browsingTopics() de um iframe para conferir temas observados para o usuário atual.

O cabeçalho é enviado em uma solicitação desde que a política de permissão adequada esteja em execução, o contexto seja seguro e as configurações do usuário permitam. Os tópicos não são fornecidos nos cabeçalhos das solicitações de navegação.

O cabeçalho da solicitação da API Topics tem esta aparência:

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"

Este exemplo inclui dois temas da taxonomia de temas, 186 e 265, além de informações sobre a versão de cada um deles.

A inclusão do cabeçalho de tópicos nas solicitações XHR está disponível apenas temporariamente, e o suporte será removido no futuro.

Marcar temas como observados com Observe-Browsing-Topics

Se uma solicitação incluir um cabeçalho Sec-Browsing-Topics e a resposta a essa solicitação incluir um cabeçalho Observe-Browsing-Topics: ?1, os temas do cabeçalho da solicitação serão marcados pelo navegador conforme observados. Os temas observados estão qualificados para cálculo pela API Topics. Esse mecanismo foi desenvolvido para corresponder à funcionalidade fornecida pelo uso da API JavaScript de um iframe.

A captura de tela abaixo mostra os tópicos registrados ao visitar os sites na página de demonstração da API.

Página de demonstração da API Topics em glitch.me
A demonstração do glitch.me para testar a API.

Esta lista mostra os sites que você pode visitar na demonstração para registrar tópicos de interesse. Como você pode ver, a categoria "Artes e entretenimento/Humor" na captura de tela não é o tema de um desses sites. Portanto, o tópico registrado foi adicionado como os 5% de temas aleatórios possíveis.

  • 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.

É possível verificar quais temas são reais e quais são aleatórios na guia "Estado dos temas" da página chrome://topics-internals. Esta captura de tela mostra um exemplo de diferentes sessões de navegação.

A guia "Estado dos temas" oferece informações sobre os temas observados.
Guia "Estado dos temas" mostrando temas reais e aleatórios.

Próximas etapas

Se você desenvolve adtech, faça testes e participe da API Topics. Leia o guia do desenvolvedor para recursos mais detalhados.

Interaja e compartilhe feedback