Web Application Security Memo

ウェブセキュリティに関するメモ書き

CSP（Contents Security Policy）の記述例

※当サイトにはプロモーションが含まれています。

公開日: 更新日:

記述例

  1. デフォルト設定の記述をする(HTTPレスポンスヘッダの出力)。

    • 同一オリジンも含めて全てのソース1からの読み込みを禁止する場合

      Content-Security-Policy: default-src 'none';

    • 同一オリジンを除く全てのソースからの読み込みを禁止する場合

      • default-src を使うと、child-src, connect-src, font-src, img-src, media-src, object-src, script-src, style-srcに対してまとめてポリシーを指定できる。詳しくは → http://www.w3.org/TR/CSP2/#directive-default-src を参照すること。
      Content-Security-Policy: default-src 'self';

  2. 必要であれば、各ソースに対する個別設定を後ろに追加して設定を上書きしていく(セミコロン区切り)。

    • 最初に全てのソースを禁止した上で、特定のソースの設定を上書きしていく場合

      Content-Security-Policy: default-src 'none'; script-src 'self' www.google-analytics.com platform.twitter.com 'nonce-xxxxxx';

    • 最初に同一オリジンのみ許可した上で、特定のソースの設定を上書きしていく場合

      Content-Security-Policy: default-src 'self'; script-src 'self' www.google-analytics.com platform.twitter.com 'nonce-xxxxxx';

    • メモ

      • 最初に default-src で ‘self’ を指定しておき、あとから特定のソースの設定を上書きする場合、’self’ が必要なら、再度指定する必要がある。
      • 設定が間違っていればブラウザの開発者ツール（コンソール）にエラーが出力されるので、そのエラーメッセージを見ながら必要なホストを必要なディレクティブに追加していけばよい。

メモ

  • 上記の書き方で、Google Analytics や Twitter 等のボタンをウェブの画面に貼り付ける場合の設定を書くことができた。ただ、はてなブックマークのボタンはいろいろJavaScriptでやっているため対応するのが非常に面倒で途中でやめた。
  • 以下のページを参照しながら書けばよさそう。

その他のメモ

  • Firefox は nonce に対応していない。
  • Data URL scheme を許可する場合は、例えば img-src 'self' data:; といった記述になる。
  • React では、タグに対して onClick={ ... } のような記述を行うが、あれは実際にはインラインな記述にはならないので問題ない。
  • HTMLのタグに対して style属性を直接書くのも禁止されるのは結構面倒だと思う。
  • script-src ‘self’ とした場合にどういう挙動になるか？
    • 外部のJavaScriptの読み込みは禁止
    • インラインの script は禁止
    • イベント属性は禁止
      • これは不便かもしれない。

参考

  1. 本記事において「ソース」というのは、script-src, style-src 等のことを指します。 ↩

関連記事

広告

広告

広告