Topics API 示範

實驗並學習如何以最省力的方式從主機名稱推測主題。

導入狀態

Topics API 示範會說明如何從主機名稱推測主題。造訪示範網站時，您可以預覽系統觀察到的主題，而且設定非常少。

我們的示範版呈現了 Topics API 的大多數功能，方便您熟悉 API 的實作方式。

您也可以執行 Topics Colab，試用 Topics 分類器模型。

以下影片是示範作業的運作方式。

使用 chrome://flags 或功能旗標進行測試

如要以單一使用者的身分試用 Topics API，目前需要執行 Chrome 101 以上版本：

  • 在 Chrome 的「chrome://flags/#privacy-sandbox-ads-apis」頁面中啟用 API：

    透過 chrome://flags/#privacy-sandbox-ads-apis 頁面啟用 Topics API
    用於啟用或停用 API 的 chrome://flags/#privacy-sandbox-ads-apis 頁面。

  • 透過包含下列旗標的指令列執行 Chrome：

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

Topics API 示範

主題示範說明如何使用其他標記調整設定，例如訓練週期長度。如果是透過指令列旗標執行 Chrome 來存取 Topics API，請勿設定 chrome://flags，因為這些 API 可能會覆寫指令列設定。

「透過旗標執行 Chromium」一文說明瞭如何透過指令列在執行 Chrome 和其他以 Chromium 為基礎的瀏覽器時設定標記。雖然這個示範是針對 Google Chrome 所設計。

Topics API 標頭示範

topics-fetch-demo.glitch.me 中的示範說明瞭如何使用 fetch() 要求和回應標頭來存取主題，並將主題標示為觀察項目。

存取 Sec-Browsing-Topics 要求標頭

API 呼叫端不必使用 iframe 中的 document.browsingTopics() 查看使用者主題，而是可透過 fetch() 要求 (在選項參數中包含 {browsingTopics: true}) 的 Sec-Browsing-Topics 要求標頭或相同標頭 (將 deprecatedBrowsingTopics 屬性設為 true) 的相同標頭中存取觀察的主題。

例如：

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

在支援 API 的瀏覽器中，fetch() 要求會包含 Sec-Browsing-Topics 標頭，其中列出針對要求網址主機名稱觀察到的主題：在這個範例中為 topics-server.glitch.me。

如果系統沒有觀察到這個主機名稱和這位使用者的主題，則系統會納入標頭，但值空白。換句話說，fetch() 要求的 Sec-Browsing-Topics 標頭只會包含呼叫端與要求網址主機名稱相符的呼叫端，並觀察到目前使用者瀏覽器的相關主題。這和從 iframe 呼叫 document.browsingTopics()，查看目前使用者觀察到的主題時相同。

只要要求標頭具備適當的權限政策，且內容安全無虞且使用者設定允許，系統就會傳送要求。導覽要求的標頭中不會提供主題。

Topics 要求標頭如下所示：

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"

這個範例包含 Topics 分類的兩個主題 (186 和 265)，以及每個主題的版本資訊。

在 XHR 要求中加入主題標頭的功能目前暫時無法使用，我們將於日後停止支援。

使用 Observe-Browsing-Topics 將主題標示為觀察項目

如果要求包含 Sec-Browsing-Topics 標頭，且該要求的回應包含 Observe-Browsing-Topics: ?1 標頭，瀏覽器就會將要求標頭中的主題標示為觀察項目。觀察到的主題可透過 Topics API 計算。這種機制是為了比對您在 iframe 中使用 JavaScript API 所提供的功能。

下方螢幕擷取畫面顯示了從造訪 API 示範網頁所記錄的主題。

glitch.me 上的 Topics API 示範頁面
試用 API 的 glitch.me 示範。

這份清單會列出您可以從示範中造訪哪些網站，以便記錄您感興趣的主題。如您所見，螢幕截圖中的「藝術與娛樂」/「幽默」類別並非這些網站的主題，因此這個記錄的主題是最多增加 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.

您可以前往 chrome://topics-internals 頁面的「主題狀態」分頁，查看哪些主題是真實的，以及哪些主題為隨機挑選。這張螢幕截圖顯示不同瀏覽工作階段的範例。

「主題狀態」分頁提供觀察到的主題相關資訊。
「主題狀態」分頁會顯示真實和隨機的主題。

後續步驟

如果您是廣告技術開發人員，請使用 Topics API 實驗並參與。如需更多資源，請參閱開發人員指南。

交流及分享意見回饋