• #GA4
  • #OGP
  • #Cloudflare
  • #Bot Protection
  • #キーイベント
  • #SEO
開発komatsu-sosメモ

GA4キーイベント設定とCloudflare Bot ProtectionによるOGP遮断の解消

地域密着サービス業のサイトで、GA4のキーイベント設定とOGP表示の修正を一気に片づけた。OGPの方はタグ自体に問題がなくて、原因を掴むまで少し回り道をした。Cloudflareの管理画面でBot Protectionの設定を変えた瞬間にSNSのプレビューが表示されて、画面の前で思わず手を叩いた。

GA4: phone_callイベントをキーイベントに設定

やったこと

サイトに設置していた電話タップ計測用の phone_call カスタムイベントを、GA4管理画面でキーイベント（旧コンバージョン）に昇格させた。

手順は以下の通り:

  1. GA4管理画面 → 「データの表示」→「キーイベント」を開く
  2. 「新しいキーイベント」→ イベント名に phone_call を入力して保存
  3. リアルタイムレポートで実際にタップして計測を確認

キーイベントに設定すると、GA4のレポート上で専用カラムに集計される。「探索」レポートでフィルタせずに成果を追えるようになった。

Google広告連携の判断

キーイベント設定後、Google広告との連携も検討した。GA4とGoogle広告をリンクすると、キーイベントをコンバージョンとしてインポートでき、入札最適化に使える。

現時点では広告出稿の予定がないため、連携は見送った。広告を始めるタイミングで以下を実施すればよい:

  • GA4管理画面 → 「プロダクトリンク」→ Google広告アカウントをリンク
  • Google広告側でGA4キーイベントをコンバージョンとしてインポート

GA4の自動メールレポート

クライアントに定期レポートを共有する手段として、GA4のメールレポート機能を案内した。

  • GA4のレポート画面右上 → 「共有」→「メール配信をスケジュール」
  • 頻度（日次/週次/月次）と宛先を設定するだけで自動配信される
  • PDFまたはCSV形式で届く

管理画面を開かなくても数字を確認できるので、GA4に慣れていない担当者にも渡しやすい。

OGP問題: Cloudflare Bot Protectionがボットを遮断していた

症状

SNSやチャットツールでサイトURLを共有したとき、OGP画像とdescriptionが表示されなかった。リンクを貼っても素のURLがそのまま表示される状態。

調査

まずHTMLソースを確認した。<meta property="og:image"> や <meta property="og:description"> は正しく出力されていた。

<meta property="og:title" content="...">
<meta property="og:description" content="...">
<meta property="og:image" content="https://example.com/og-image.jpg">

タグに問題がないのに表示されない。ブラウザで開くと正常に見えるが、SNSのクローラーがページ内容を取得できていない状態だった。

原因

Cloudflare の Bot Protection（Bot Fight Mode） が、SNSやメッセンジャーのOGPクローラーをボットとして検出し、Cloudflareチャレンジページ（JavaScriptチャレンジやCAPTCHA）を返していた。

OGPクローラーはヘッドレスなHTTPクライアントなので、JavaScriptチャレンジを突破できない。結果として、クローラーが受け取るのはチャレンジページのHTMLであり、OGPメタタグを含む本来のHTMLではなかった。

つまり:

  • 人間がブラウザでアクセス → 正常に表示される
  • ボット（OGPクローラー）がアクセス → Cloudflareチャレンジで遮断される

対応

Cloudflare管理画面でBot Protection設定を変更した。

  1. Cloudflareダッシュボード → 対象ドメインを選択
  2. 「セキュリティ」→「ボット」を開く
  3. Bot Fight Modeの設定を確認し、OGPクローラーが通過できるよう調整

設定変更後、SNSでURLを再共有するとOGP画像とdescriptionが正しく表示された。

補足: 既知のボットの扱い

Cloudflare の Bot Protection には「確認済みボット」のカテゴリがあり、Googlebot 等の主要クローラーはデフォルトで許可されている。しかし、SNS系のOGPクローラー（Twitterbot、LINE Bot、Facebook External Hit等）は必ずしも「確認済みボット」に含まれていない場合がある。

Bot Fight Modeを有効にしていると、これらのクローラーがチャレンジ対象になる。今回はまさにこのパターンだった。

振り返り

OGPが表示されないときに真っ先にHTMLのmetaタグを疑ったが、タグは正しく出力されていた。問題はその手前、CDN/WAFレイヤーにあった。ブラウザで確認してOKでも、ボットには別のレスポンスが返っている可能性がある、という視点が一つ増えた。

Cloudflareのセキュリティ設定は「守りすぎ」の方向に倒れがちで、Bot Fight Modeを有効にした時点でOGPが死ぬ、というのは見落としやすい。今後Cloudflare Pagesで新しいサイトを立てるときは、デプロイ直後にOGPの表示確認をチェックリストに入れる。