静的サイト向けCSPヘッダー作成ツール｜チェックだけで簡単生成！Apache・Nginx対応

Webサイトのセキュリティを強化するContent-Security-Policy (CSP)ヘッダーを、チェックボックスの選択だけで簡単に生成するツールです。静的サイトでよく利用される外部サービスやCDNの許可設定をプリセットしており、Apache (.htaccess)、Nginx、HTMLのmetaタグ形式でコードを即座に出力します。

💡 ツール概要

このツールは、クロスサイトスクリプティング（XSS）などの脆弱性からサイトを保護するためのCSP設定を、専門知識がなくても直感的に作成できるように設計されています。

• 主要サービスに標準対応 Google Analytics, Google Fonts, YouTube, 各種CDNなど、静的サイトで一般的に利用されるサービスのドメイン設定をワンクリックで追加できます。

• 3つの出力形式をサポート Apache (.htaccess用), Nginx (nginx.conf用), HTML (<meta>タグ) の3つの形式に対応。ご利用のサーバー環境に合わせて最適なコードを生成します。

• カスタムドメインの追加 独自のAPIエンドポイントや画像サーバーなど、プリセット以外のドメインも自由に追加してポリシーに含めることができます。

• リアルタイムでの反映 チェックボックスや入力欄を操作すると、設定内容が即座に出力コードに反映されるため、試行錯誤しながら最適なポリシーを構築できます。

🧐 よくある質問

Q. unsafe-inlineとは何ですか？使用しても安全ですか？

A. HTML内の<script>タグに直接記述されたコードや、HTML要素のstyle属性によるインラインスタイルを許可するためのキーワードです。CSPの目的であるXSS対策の観点からは、この設定はセキュリティレベルを低下させるため、使用は推奨されません。しかし、既存のライブラリやCMSの仕様上、やむを得ず必要になる場合があります。可能であれば、nonceやhashといった、より安全な仕組みへの移行を検討してください。

Q. default-src 'self' とは何を意味しますか？

A. default-srcは、script-srcやimg-srcなど、他のディレクティブで個別に指定されていないリソースのデフォルトの読み込み元を定義します。'self'は、そのサイト自身のドメイン（同一オリジン）からのリソースのみを許可するという意味です。これはCSPにおける最も基本的かつ重要な設定の一つで、意図しない外部ドメインからのリソース読み込みをブロックする土台となります。

Q. HTMLのmetaタグでCSPを設定する場合の注意点はありますか？

A. <meta>タグによるCSP設定は、HTTPヘッダーを直接編集できないホスティング環境などで有効な代替手段ですが、いくつかの制限があります。例えば、クリックジャッキング対策に有効なframe-ancestorsディレクティブや、CSP違反を報告するreport-uri（およびreport-to）ディレクティブはサポートされません。セキュリティを最大限に高めるためには、サーバー側でHTTPヘッダーとして送信する方法が最も推奨されます。

📚 CSPの豆知識

Content Security Policy (CSP) は、Webページがどのオリジン（ドメイン）からリソース（スクリプト、スタイルシート、画像など）を読み込むことを許可するかを、ブラウザに細かく指示するためのセキュリティ機能です。これにより、悪意のある第三者によって注入されたスクリプト（XSS攻撃）が実行されるのを防いだり、データ漏洩のリスクを低減させたりすることができます。

CSPは非常に柔軟で強力ですが、その分ディレクティブ（指示）の種類が多く、設定が複雑になりがちです。一つの設定ミスでサイトの表示が崩れたり、必要な機能が動作しなくなったりすることもあります。そのため、最初はContent-Security-Policy-Report-Onlyヘッダーを使用して、ポリシーを適用せずに違反レポートのみを収集するモードで導入し、問題がないことを確認してからContent-Security-Policyヘッダーに切り替えるのが安全な導入手順とされています。