Edited at
MonacaDay 2

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

More than 1 year has passed since last update.

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