web-dev-qa-db-fra.com

Violer la directive relative à la sécurité du contenu après la mise à niveau de ember-cli 0.0.47

J'ai mis à niveau mon application ember-cli vers la version 0.0.47 et je reçois maintenant un tas d'erreurs dans la console de mon navigateur liées à la politique de sécurité du contenu. Comment puis-je résoudre ce problème?

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".

Voici les lignes de mon fichier 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>
59
Peter Brown

Après avoir lu des documents sur http://content-security-policy.com/ et https://github.com/rwjblue/ember-cli-content-security-policy =, J’ai ajouté quelques règles à mon fichier config/environment.js comme ceci:

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"
    },

  // ...
};

Cela a fait disparaître toutes les erreurs immédiates, mais dès que j'ai commencé à naviguer dans mon application, de nouvelles erreurs sont apparues liées aux sources multimédia S3.

Je suis sûr que cela fonctionne pour les applications qui n'incluent aucune ressource externe, mais j'ai décidé de supprimer "" ember-cli-content-security-policy "de mon fichier package.json.

126
Peter Brown

Je devais l'utiliser pour créer un lien vers les polices de Google:

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

Dans le config/environment.js fichier que j'ai utilisé

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