Cloudflare Web Analytics

要点: Cloudflare Pages プロジェクトの Settings から toggle 1 個で有効化できる。cookie 不要、GDPR 準拠、無料。beacon は Cloudflare が自動注入するのでコード変更ゼロ。

手順#

保存すると次回デプロイから beacon script が自動注入される。

見られるデータ#

• Pageview 数 (per path / 全体)
• Referrer 別訪問元
• Country 別
• Browser / OS
• Core Web Vitals (LCP, FID, CLS)

個人特定情報は取らない。cookie 使わない、fingerprint 使わない。

制限#

• リアルタイムではない (集計に数分-数十分の遅延)
• 詳細な user session tracking は不可 (Cloudflare の設計方針)
• 詳細分析が要るなら Plausible や GoatCounter に有料移行

見方#

Cloudflare Dashboard → Analytics & Logs → Web Analytics → プロジェクト選択

過去 7 日、30 日、90 日で切替。Path 別のランキングが「よく見るページ」を教える。

手動でコード側で beacon を仕込む場合#

Pages 自動注入を使わず手動で入れたい時 (別ホストや、site-wide で control したい時):

1. Cloudflare Dashboard → Analytics & Logs → Web Analytics → Add a site
2. Beacon token を取得
3. <head> に:

<script defer src='https://static.cloudflareinsights.com/beacon.min.js'
  data-cf-beacon='{"token": "YOUR_TOKEN"}'></script>

Next.js なら app/layout.tsx の <head> (metadata の other) で <Script> タグ。