More than 5 years have passed since last update.

Contents Security Policy（CSP）のお勉強

Last updated at 2018-04-25Posted at 2016-04-20

Contents Security Policy（CSP）

個人でのお勉強時のメモです。殆どコピペなので。。。

CSPとは？

CSP（Content Security Policy）は、クロスサイトスクリプティング (XSS) 、データインジェクション、クリックジャッキング、パケットキャプチャなどブラウザに表示されるコンテンツを用いた、よく知られた種類の攻撃を検出して軽減するするために追加されたセキュリティレイヤー。

サーバサイドからブラウザに対してコンテンツの使用ポリシーを伝えて各種攻撃を回避する。

仕組み

CSP を記述することで、コンテンツの提供元や取得方法（HTTPS経由のみ取得可能など）を制限することができ、コンテンツ提供者が意図しないコンテンツを読み込ませることを阻止することができる。
コンテンツには実行可能なスクリプトも含まれているため、第三者による悪意のスクリプトの実行を制限することができる。

ポリシーの記述方法

デフォルトポリシー

デフォルトでは以下のポリシーが適用される。

data: URLでのコンテンツの埋込
<a href=’javascript:’>のようなhtmlへのjavascriptの埋込
onclickなどのインラインのイベント属性
<script>要素内のインラインスクリプト
eval() での文字列コード new Function()コンストラクタ
setInterval()内での文字列コード setTimeout()内での文字列コード
<style>要素でのCSSの設定
インラインのstyle属性

カスタムポリシー

コンテンツ提供側で変更可能なディレクティブは以下の通り。

default-src
デフォルトで許可するURIを指定
inline-script
インラインスクリプトを有効にする
eval-scriot
evalを有効にする
script-src
scriptの提供元を指定
style-src
cssの提供元を指定
img-src
画像とfavicon の提供元を指定
font-src
ウェブフォント@font-face で読込まれる提供元を指定
media-src
audio,video で参照する提供元を指定
object-src
object,embed,applet で参照する提供元を指定
frame-src
frame,iframe で参照する提供元を指定
xhr-src
XMLHttpRequestの提供元を指定
connect-src
web socketの提供元を指定
form-action
formの送信先を指定
sandbox
sandbox属性の値を設定
plugin-type
pdfなど application/octet-streamヘッダーで提供されるもの

ディレクティブ

各ディレクティブの詳細は以下を参照。

ポリシーのテスト

"report-only" モードで動作させることで記述したポリシーが適切であることをポリシーをサイトに適用する前に確認することができる。report-only モードで動作している間ポリシーは適用されず、何らかの違反があった場合は指定した URI に報告される。

それ以外にも、Firefox、Google Chrome にはそれぞれテストツールのアドオンが提供されている。

CSP Tester - Google Chrome Add-on
UserCSP - Firefox Add-on

CSP違反レポート

CSPに違反したリクエストが発生した場合、そのリクエストに関するCSP違反レポート（JSON形式）を生成するように設定できる。違反レポートの送付先を指定することで、違反の蓄積と集計が可能。CSP違反レポートのデータ形式は汎用なので、レポートを受け付けるSaaSも幾つかある。

違反レポートサービス

https://report-uri.io/

※ Google Analytics とかにもありそうなので、探してみたけど見あたらなかった。

Reference

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up