セキュリティ

追跡タグを防ぐAIプロンプトと公開前スキャン

AIにHTMLを生成させるとき、プロンプトの書き方次第でトラッキングタグが混入するリスクを大きく下げられます。それでも万全ではないため、公開前の自動スキャンと組み合わせた「二重の防線」を張ることが、継続的な安全運用の鍵になります。

なぜ危ないのか

AIがHTMLを生成する際、学習データに含まれる典型的なWebサイトのテンプレートを参照するため、GA4タグやMeta Pixelが「一般的なWeb標準」として出力されることがあります。プロンプトで明示的に禁止しない限り、意図せず混入します。

複数のHTMLファイルを連続生成した場合、最初のファイルにタグが含まれていなくても、途中のファイルから突然追加されることがあります。AIの出力は確率的であるため、毎回同じ結果になるとは限りません。スキャンを省略できない理由がここにあります。

  • 相手がログインなしで開ける状態か確認する
  • PCとスマホで最低1回ずつ表示を確認する
  • 内部情報・個人情報・不要な外部送信が残っていないか見る
  • レビュー期限と修正時の差し替え方を決めておく

ソースで見る場所

生成直後に`grep -n 'analytics\|pixel\|hotjar\|clarity\|gtag\|fbq' output.html`を実行します。マッチした行が0件であればタグなしと判断できます。Makefileやpackage.jsonのscriptsにこのコマンドを登録しておくと、習慣化しやすくなります。

`<head>`と`</body>`の直前は特にトラッキングタグが挿入されやすい場所です。HTMLの先頭50行と末尾20行をテキストエディタで目視確認する習慣をつけると、grepで検出できない難読化されたコードも発見しやすくなります。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

安全に共有する設定

スキャンをパスしたHTMLをギガサイト便にアップロードする前に、Content-Security-PolicyでデフォルトのSrcを`self`に制限するmetaタグを追加します。これにより、見落としたタグがあっても外部スクリプトの実行がブロックされます。

ギガサイト便の限定公開URLにはパスワードと有効期限を設定します。スキャンで検出できなかった追跡コードが残っていても、アクセスできる人数と期間を絞ることでデータ流出の規模を最小化できます。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

再発防止ルール

AIプロンプトの先頭に固定テキストとして「このHTMLはプレビュー専用です。Google Analytics・Meta Pixel・Hotjar・Microsoft Clarityなどのトラッキングスクリプトを含めないでください。外部ドメインへのscriptタグも不要です」と記載します。

月に1回、過去1ヶ月に生成したHTMLファイルをまとめてスキャンし、混入実績がないかを確認します。混入が見つかった場合はプロンプトに追加の禁止ワードを加えてルールを更新します。このサイクルを繰り返すことで、プロンプトの品質が継続的に改善されます。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

よくある質問

Content-Security-PolicyをHTMLのmetaタグで設定する場合の書き方を教えてください。

`<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'">`を`<head>`内に追加します。ただしmetaタグのCSPは一部の指令(frame-ancestorsなど)に対応していないため、サーバーのレスポンスヘッダーでの設定を優先してください。

AIに「トラッキングタグなし」と明示したのに混入した場合はどう対処しますか?

まず混入したタグの種類を確認し、プロンプトの禁止ワードリストにそのサービス名を追加します。それでも繰り返す場合は別モデルや別ツールに切り替えて比較します。プロンプトだけに頼らず、生成後のスキャンを必須ステップとして維持することが重要です。

grepスキャンは一人でやるべきですか?自動化する方法はありますか?

GitHub Actionsのワークフローに`run: grep -rE 'gtag|fbq|hotjar' dist/ && echo 'FOUND' || echo 'CLEAN'`を追加し、FOUNDの場合にジョブを失敗させることで自動化できます。プッシュのたびに確認されるため、手動スキャンの抜け漏れを防げます。

関連記事

セキュリティ

APIキー直書きを防ぐAIプロンプトと公開前スキャン

AI生成HTMLへのAPIキー直書きをプロンプト設計で防ぎ、公開前スキャンで二重検出したい開発者・制作担当者向け。具体的なプロンプト文言とgrepコマンドをセットで紹介します。

4分で読める
「セキュリティ」の記事をもっと見る →