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…