Adobe Analyticsのスクリプトがブロックされる場合のコンテンツセキュリティポリシー（CSP）の設定
はじめに
Adobe Analytics の計測タグは、Web サイトにスクリプトを動的に読み込むように設計されたタグ管理システムです。
このAdobe Analytics を導入する際に、初めに下記のように スクリプトエラーが発生することがあります。
この場合の原因として考えられるのが、セキュリティ上の問題の発生を回避するためContent-Security-Policy（CSP）にて動的に読み込まれるこれらのスクリプトをブロックするよう設定している場合があります。
今回は、Adobe Analytics タグで動的に読み込まれるスクリプトを許可するよう CSP を設定する方法を解説します。
Content-Secuirty-Policy(CSP)とは？
Content-Security-Policy（CSP）とは、Webサイトのセキュリティを向上させるために使用されるブラウザーの機能です。CSPは、XSS（クロスサイトスクリプティング）攻撃、データ盗難、クリックジャッキングなどのWeb攻撃を防ぐために、Webページで許可されたリソースのみが読み込まれるようにブラウザーに指示します。CSPは、HTTPヘッダーとしてWebサーバーからブラウザーに送信されます。CSPの実装には、Webサイトの開発者が必要です。CSPは、Webサイトのセキュリティを強化するために、現代のWeb開発において重要な役割を果たしています。
（CSP の詳細については、「MDN Web ドキュメント」を参照してください。）
CSPがAdobe Analyticsに与える影響
CSPの導入によって、WebアプリケーションにおけるJavaScriptの実行を制限できるため、Adobe Analyticsに与える影響を考慮する必要があります。具体的には、Adobe Analyticsが収集するデータに影響を与える可能性があります。そのため、CSPを導入する場合には、Adobe Analyticsとの連携についても考慮する必要があります。
また、CSPの導入によってWebアプリケーションのパフォーマンスにも影響が出る可能性があるため、導入前にパフォーマンステストを行うことが重要です。さらに、CSPの設定には細かいパラメーターが多数存在するため、導入前に専門家の知見を取り入れることをおすすめします。
影響を回避するための設定方法
Adobe Analyticsタグを CSP と連携させるには、以下2 つの設定が必要になります。
- タグライブラリのソースを許可する
- インラインスクリプトを許可する
この条件が満たされない場合、タグライブラリおよびその他の必要な JavaScript ファイルはブラウザーでブロックされ、ページに読み込まれません。
CSP は、サーバー応答に Content-Security-Policy HTTP ヘッダーを追加するか、HTML ファイルの <meta> セクションに設定済みの <head> 要素を追加することで実装されます。
①タグライブラリのソースを許可する
CSP を使用する場合は、信頼されたドメインを Content-Security-Policy ヘッダーの値に含める必要があります。
（アドビ管理ホスティングを使用している場合）
▼HTTP ヘッダーの場合
Content-Security-Policy: script-src ‘self’ assets.adobedtm.com
▼HTML <meta>タグの場合
<meta http-equiv=”Content-Security-Policy” content=”script-src ‘self’ assets.adobedtm.com“>
前提条件として、タグライブラリは非同期的に読み込む必要があります。タグライブラリの同期読み込みでは動作しません（コンソールエラーや、ルールが正しく実行されない原因となります）。
②インラインスクリプトを許可する
CSP はデフォルトでインラインスクリプトを許可しないため、手動で設定する必要があります。
インラインスクリプトを許可するにはnonce で許可（セキュリティレベル高）するオプションもありますが、今回は割愛します。
すべてのインラインスクリプトを許可する設定オプションの安全性はあまり高くありませんが、実施やメンテナンスは容易です。
（アドビ管理ホスティングを使用している場合）
▼HTTP ヘッダーの場合
Content-Security-Policy: script-src ‘self’ assets.adobedtm.com ‘unsafe-inline’
▼HTML <meta>タグの場合
<meta http-equiv=”Content-Security-Policy” content=”script-src ‘self’ assets.adobedtm.com ‘unsafe-inline'”>
まとめ
今回は、Adobe Analyticsのスクリプトがブロックされる場合のコンテンツセキュリティポリシー（CSP）の設定で、タグライブラリファイルとインラインスクリプトを受け入れるように 設定する方法を説明しました。この設定が必要になるのは、ウェブサイトやアプリケーションでAdobe Analyticsを使用する場合です。特に、CSPが設定された場合は、ブロックされてしまうことがあります。CSPの設定方法を覚えておくことで、スムーズにAdobe Analyticsを使用することができます。
以上、ご参考になりましたら嬉しく思います。今後も、より詳しく解説していくので、お楽しみに！
Implement DigitalではAdobe Analyticsの導入・実装・運用を支援するサービスを提供しています。
ご興味がありましたらお問い合わせください。