web-dev-qa-db-ja.com

ember-cli 0.0.47アップグレード後のコンテンツセキュリティポリシーディレクティブへの違反

Ember-cliアプリを0.0.47にアップグレードしましたが、コンテンツセキュリティポリシーに関連するブラウザーコンソールで大量のエラーが発生しています。この問題を修正するにはどうすればよいですか？

Refused to load the script 'http://use.typekit.net/abcdef.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' localhost:35729".
 login:1
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' localhost:35729". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.
 login:20
Refused to load the script 'http://connect.facebook.net/en_US/all.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' localhost:35729".
 login:1
Refused to load the script 'http://maps.googleapis.com/maps/api/js?libraries=places' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' localhost:35729".

App/index.htmlファイルの行は次のとおりです。

<script type="text/javascript" src="//use.typekit.net/abcdef.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places"></script>
ember.jsember-clicontent-security-policy
59
Peter Brown

http://content-security-policy.com/ および https://github.com/rwjblue/ember-cli-content-security-policy でいくつかのドキュメントを読んだ後=、config/environment.jsファイルに次のようなポリシーを追加しました。

module.exports = function(environment) {
  var ENV = {
    contentSecurityPolicy: {
      'default-src': "'none'",
      'script-src': "'self' 'unsafe-inline' 'unsafe-eval' use.typekit.net connect.facebook.net maps.googleapis.com maps.gstatic.com",
      'font-src': "'self' data: use.typekit.net",
      'connect-src': "'self'",
      'img-src': "'self' www.facebook.com p.typekit.net",
      'style-src': "'self' 'unsafe-inline' use.typekit.net",
      'frame-src': "s-static.ak.facebook.com static.ak.facebook.com www.facebook.com"
    },

  // ...
};

これにより、即時エラーはすべてなくなりましたが、アプリの操作を開始するとすぐに、S3メディアソースに関連する新しいエラーが発生しました。

これは外部リソースを含まないアプリでも動作するはずですが、package.jsonファイルから「ember-cli-content-security-policy」を削除することにしました。

126
Peter Brown

Googleからフォントにリンクするときにこれを使用する必要がありました。

<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Lato:400,700,900'>

の中に config/environment.js使用したファイル

contentSecurityPolicy: {
  'font-src': "'self' data: fonts.gstatic.com",
  'style-src': "'self' 'unsafe-inline' fonts.googleapis.com"
},
18
superlogical