Limited support 一部のブラウザのみ対応。使用時はサポート状況を確認すること。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
browsingTopics
非推奨 非標準
126
126
126
HTML 属性
allow (browsing-topics)
非推奨 非標準
115
115
115
browsingtopics
非推奨 非標準
126
126
126
DOM API
init_browsingTopics_parameter
非推奨 非標準

init.browsingTopics`パラメータ

126
126
126
browsingTopics
非推奨 非標準

browsingTopics は HTMLIFrameElement インターフェイスのプロパティで、関連付けられた iframe のソースに対するリクエストとともに、現在のユーザーが選択したトピックを Sec-Browsing-Topics ヘッダーで送信すべきであることを指定する論理値です。これは、HTML の browsingtopics 属性を反映しています。

126
126
126
Request (init browsingTopics parameter)
非推奨 非標準

init.browsingTopics`パラメータ

126
126
126
その他
Observe-Browsing-Topics
非推奨 非標準

HTTP Observe-Browsing-Topics 応答ヘッダーは、Topics API を有効にする機能によって生成されたリクエストへの応答で観察される、呼び出し元サイトの URL (つまり、広告技術 iframe が埋め込まれているサイト) から推測される関心のあるトピックをマークするために使用されます。 その後、ブラウザーはこれらのトピックを使用して、現在のユーザーのトップ トピックを計算します。

115
115
115
browsing-topics
非推奨 非標準

HTTP の Permissions-Policy ヘッダーの browsing-topics ディレクティブは、トピック API へのアクセスを制御します。

115
115
115
Sec-Browsing-Topics
非推奨 非標準

HTTP Sec-Browsing-Topics リクエスト ヘッダーは、現在のユーザーに対して選択されたトピックを関連リクエストとともに送信します。これは、表示するパーソナライズされた広告を選択するために広告テクノロジー プラットフォームによって使用されます。

115
115
115
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT
const topics = await document.browsingTopics();
for (const topic of topics) {
  console.log('Topic:', topic.topic, 'Version:', topic.version);
}

実務での使いどころ

  • Topics の活用

    browsingTopics() は Document インターフェイスのメソッドで、ユーザーのトップトピックを表すオブジェクトの配列で履行されるプロミスを返します。

注意点

  • 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。