Supershipの名畑です。「鬼太郎誕生 ゲゲゲの謎」は鬼太郎ファンはもちろんのこと、鬼太郎を知らない方にもぜひ見て水木しげるの世界への入り口としてほしい映画でした。ただしPG12なのでご注意を。
はじめに
2月1日に「Google Chrome プライバシーサンドボックス Topics APIの概要と試し方」という記事を書きました。
あれから10ヵ月近くが経ち状況も変わりましたので、改めてまとめます。
プライバシーサンドボックスとは？
ウェブ向けのプライバシー サンドボックスは、サードパーティ Cookieを段階的に廃止し、隠されたトラッキングも制限します。新しいウェブ基準（英語）を策定することで、データのプライバシー保護を強化しながらデジタル事業の構築を可能にします。
Android向けのプライバシー サンドボックスは、ユーザーのプライバシー保護を優先しながら、アプリの開発者が事業のサポートや成長に必要なツールを提供します。広告ID
などの複数アプリ共通の識別子を使用しないことでサードパーティとのデータ共有を制限します。
Chromeにおけるサードパーティークッキーの完全廃止は2024年7月以降で予定されています。その前段階として、1%の廃止は2024年の1月〜3月で予定されています。
Topics APIとは？
Topics API は、ブラウザがユーザーの興味に関する情報をサードパーティと共有できるようにしながら、プライバシーを保護するように設計されたプライバシー サンドボックスメカニズムです。これにより、ユーザーが訪問するサイトをトラッキングせずに、インタレストベース広告（IBA）が可能になります。
つまり、Webサイトに広告を出稿する人たちは
- それが誰かはわからない
- しかしその誰かがどのような興味関心を持っているかはわかる
ということになります。
Topics APIのアップデート情報はTopics API latest updatesにまとめられています。
トピックとは？
ユーザーが興味関心を示している項目をトピックと呼びます。
トピックの分類は現在は taxonomy_v2 なので「topics/taxonomy_v2.md at main · patcg-individual-drafts/topics · GitHub」の通りです。現時点では469種類です。
エポックとは？
ユーザーの興味関心の分析期間です。この期間毎に集計が行われます。
デフォルトでは7日間です。
自分のトピックの確認方法は？
Chromeのアドレスバーに下記を打ち込んでEnterです。
chrome://topics-internals/
直近4つのエポックそれぞれでのトピックが5つずつ、順番に並びます。
下記スクリーンショットはそのうちの1エポックのものです。
これがChromeが推測した「ユーザー(ここでは私)が関心を持っているトピックス」ということになります。
この画面でCalculate Nowを押すと、そのタイミングでの再計算が行われます。
分析する情報が少ないとRandomなものが表示されるようです。
また、下記の通りで、APIでの取得においては5%の割合でランダムな情報が含まれます。
プライバシーをさらに強化し、すべてのトピックが表現されることを保証するために、トピックは、興味の分類に含まれるすべての可能なトピックから 5% の確率でランダムに選択されます。
Developer登録
現在、開発者としてPrivacy Sandbox周辺技術や関連APIにアクセスするためには登録が必要です。
トピックを取得するコード例
<!DOCTYPE html>
<html lang="ja">
<head>
</head>
<body>
<script>
async function getTopics() {
if('browsingTopics' in document && document.featurePolicy.allowsFeature('browsing-topics')) {
try {
const topics = await document.browsingTopics();
if (topics.length > 0) {
for (const topic of topics) {
console.log(topic.topic)
}
} else {
console.log('there are no topics')
}
} catch (error) {
console.log('exception with browsing topics')
}
} else {
console.log('document.browsingTopics() is not supported on this page')
}
}
getTopics();
</script>
</body>
</html>
長いですが、エラー判定やhtmlタグが主なので、実質は下記の一行だけです。
const topics = await document.browsingTopics();
ちなみに
document.browsingTopics({observe: false})
というように {observe: false} を引数として渡すと、状態を変更せずに(つまりは現在のページ閲覧がエポック計算に用いられずに)トピックの取得を行えます。
最後に
1年後の今頃にはサードパーティークッキーの量が格段に減った世界になっている、はず。
宣伝
SupershipのQiita Organizationを合わせてご覧いただけますと嬉しいです。他のメンバーの記事も多数あります。
Supershipではプロダクト開発やサービス開発に関わる方を絶賛募集しております。
興味がある方はSupership株式会社 採用サイトよりご確認ください。