8
3

More than 5 years have passed since last update.

Monacaアプリのセキュリティを担うコンテンツ セキュリティ ポリシーについて

Last updated at Posted at 2017-12-02

Monaca アプリはHTML/JavaScript/CSSでアプリのコンテンツを作ります。外部からデータを取得して利用する仕組みを使っている時に、悪意を持ったユーザによってXSSを引き起こされる可能性があります。例えばJavaScriptを実行されたり、CSSでデザインを変えられてしまうかも知れません。

そうした問題を防ぐのに使えるのがコンテンツ セキュリティ ポリシー(CSP)です。Monacaアプリではデフォルトで次のような設定になっています。

<meta http-equiv="Content-Security-Policy" content="
  default-src * data: gap: content: https://ssl.gstatic.com;
  style-src * 'unsafe-inline';
  script-src * 'unsafe-inline' 'unsafe-eval'">

デフォルトでは以下の3つが指定されています。各項目は ; で繋ぎます。

  • default-src
    基本設定です。指定しなかった設定(ディレクティブ)に対して使われます。
  • style-src
    スタイルシートの設定です。
  • script-src
    JavaScriptの設定です。

https://ssl.gstatic.com はAndroidで必要なドメインのようです(via https://github.com/apache/cordova-plugin-whitelist)。`gap:` は逆にiOSで必要な設定で、JavaScriptからネイティブの機能を呼び出すときに使われるスキームです。 data: は data://ではじまる、いわゆるdataURIを許可するという指定です。 content: はAndroidでファイル選択した時のスキームです。 file: も併用すると良いようです(via fileスキームのURIに変換する(Android) - 闘うITエンジニアの覚え書き)。

unsafe-inline はHTML中の <script /><style /> タグの許可であったり、HTMLタグの中の onclick の許可になります。 unsafe-eval はevalの許可です。

その他に指定できる値としては以下があります。

  • 'self'
  • 'none'
  • mediastream
  • blob
  • filesystem
  • https:

後はドメイン指定(ワイルドカード可)で利用できるソースのドメインを指定できます。

ソース

ソースは上記3つの他にも以下があります。他にもありますが、Corodvaアプリでは対象にならないものなのでリストに載せていません。

  • child-src
    iframeで読み込めるドメインを指定します。
  • connect-src
    Fetch、XMLHttpRequest、WebSocket、EventSourceなど外部接続系の制限を行います。
  • font-src
    @font-face で読み込める対象を制限します。
  • img-src
    画像の読み込める対象を制限します。
  • media-src
    <audio /><video /> に対して利用する対象を制限します。

CSPの設定を間違えると、出るはずのデータが表示されなかったり、コンテンツが読み込めなかったりします。かといってあまり大らかにしすぎると万一の時にセキュリティ上のリスクが高くなります。バランスを考えつつ、指定するのが良いでしょう。

8
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
3