Demo Topics API

Lakukan eksperimen dan pelajari cara topik disimpulkan dari nama host dengan penyiapan minimal.

Status penerapan

  • Topics API telah menyelesaikan fase diskusi publik dan saat ini tersedia untuk 99 persen pengguna, dengan peningkatan skala hingga 100 persen.
  • Untuk memberikan masukan tentang Topics API, buat Masalah di Penjelasan topik atau berpartisipasi dalam diskusi di Meningkatkan Grup Bisnis Periklanan Web. Penjelasan memiliki sejumlah pertanyaan terbuka yang masih memerlukan definisi lebih lanjut.
  • Linimasa Privacy Sandbox memberikan linimasa penerapan untuk Topics API dan proposal Privacy Sandbox lainnya.
  • Topics API: update terbaru menjelaskan perubahan dan peningkatan kualitas Topics API dan implementasinya.

Demo Topics API memberikan gambaran tentang cara topik disimpulkan dari nama host. Anda dapat melihat pratinjau topik yang diamati saat Anda mengunjungi situs demo, yang tidak memerlukan penyiapan.

Demo kami adalah pratinjau yang menunjukkan sebagian besar fitur Topics API agar Anda dapat memahami cara penerapan API.

Anda juga dapat menjalankan colab Topics untuk mencoba model pengklasifikasi Topics.

Video berikut menunjukkan cara kerja demo.

Menguji dengan chrome://flags atau tombol fitur

Ada dua cara untuk mencoba Topics API sebagai satu pengguna; Anda harus menjalankan Chrome 101 atau yang lebih baru:

  • Aktifkan API di halaman Chrome chrome://flags/#privacy-sandbox-ads-apis:

    Mengaktifkan Topics API menggunakan halaman chrome://flags/#privacy-sandbox-ads-apis
    Halaman chrome://flags/#privacy-sandbox-ads-apis tempat Anda dapat mengaktifkan atau menonaktifkan API.

  • Jalankan Chrome dari command line dengan tanda berikut:

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

Demo Topics API

Demo topik menunjukkan cara menggunakan tanda tambahan untuk menyesuaikan setelan, seperti panjang epoch. Jika Anda mengakses Topics API dengan menjalankan Chrome menggunakan tanda command line, jangan setel chrome://flags, karena hal ini dapat mengganti setelan command line.

Menjalankan Chromium dengan tanda menjelaskan cara menyetel tanda saat menjalankan Chrome dan browser berbasis Chromium lainnya dari command line, meskipun demo ini khusus untuk Google Chrome.

Demo header Topics API

Demo di topics-fetch-demo.glitch.me menunjukkan cara menggunakan header permintaan dan respons fetch() untuk mengakses topik dan menandainya sebagai diamati.

Mengakses header permintaan Sec-Browsing-Topics

Daripada menggunakan document.browsingTopics() dari iframe untuk melihat topik bagi pengguna, pemanggil API dapat mengakses topik yang diamati dari header permintaan Sec-Browsing-Topics dari permintaan pengambilan() yang menyertakan {browsingTopics: true} dalam parameter opsinya—atau dari header permintaan XDR yang sama yang menetapkan atribut deprecatedBrowsingTopics ke true.

Contoh:

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

Di browser yang mendukung API, permintaan fetch() akan menyertakan header Sec-Browsing-Topics yang mencantumkan topik yang diamati untuk nama host URL permintaan: dalam contoh ini, topics-server.glitch.me.

Jika tidak ada topik yang diamati untuk nama host ini dan pengguna ini, header akan disertakan tetapi nilainya kosong. Dengan kata lain, header Sec-Browsing-Topics pada permintaan fetch() hanya menyertakan topik yang telah diamati untuk browser pengguna saat ini oleh pemanggil yang asalnya cocok dengan nama host URL permintaan. Ini sama seperti jika Anda memanggil document.browsingTopics() dari iframe untuk melihat topik yang diamati bagi pengguna saat ini.

Header permintaan dikirim berdasarkan permintaan selama header tersebut memiliki kebijakan izin yang sesuai, konteksnya aman, dan setelan pengguna mengizinkannya. Topik tidak disediakan di header untuk permintaan navigasi.

Header permintaan Topics terlihat seperti ini:

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"

Contoh ini mencakup dua topik dari Taksonomi topik, 186 dan 265, beserta informasi versi setiap topik.

Penyertaan header topik dalam permintaan XHR hanya tersedia untuk sementara, dan dukungan akan dihapus pada masa mendatang.

Tandai topik sebagai diamati dengan Observe-Browsing-Topics

Jika permintaan menyertakan header Sec-Browsing-Topics dan respons terhadap permintaan tersebut menyertakan header Observe-Browsing-Topics: ?1, topik dari header permintaan tersebut akan ditandai oleh browser sebagai diamati. Topik yang diamati memenuhi syarat untuk penghitungan oleh Topics API. Mekanisme ini didesain agar sesuai dengan fungsi yang disediakan oleh JavaScript API dari iframe.

Screenshot di bawah menunjukkan topik yang dicatat saat mengunjungi situs di halaman demo API.

Halaman demo Topics API di glitch.me
Demo glitch.me untuk mencoba API.

Daftar ini menampilkan situs yang dapat Anda buka dari demo untuk mencatat topik yang diminati. Seperti yang dapat Anda lihat, kategori Seni & Hiburan/Humor di screenshot bukan topik salah satu situs tersebut, jadi topik yang dicatat ini adalah salah satu yang ditambahkan sebagai kemungkinan topik acak 5 persen.

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

Anda dapat memeriksa untuk melihat topik mana yang nyata dan mana yang acak di tab Status Topics di halaman chrome://topics-internals. Screenshot ini menampilkan contoh dari sesi penjelajahan yang berbeda.

Tab Status topik memberikan informasi tentang topik yang diamati.
Tab Status Topik menampilkan topik nyata dan acak.

Langkah berikutnya

Jika Anda adalah developer teknologi iklan, lakukan eksperimen dan berpartisipasi dengan Topics API. Baca panduan developer untuk referensi yang lebih mendalam.

Berinteraksi dan berbagi masukan