Modernizr导致内容安全策略(CSP)违规错误

Muh*_*eed 30 javascript modernizr content-security-policy

我试图在测试站点上使用新的内容安全策略(CSP) HTTP标头.当我将CSP与Modernizr结合使用时,我遇到了CSP违规错误.这是我使用的CSP策略:

Content-Security-Policy: default-src'self'; script-src'self'ajax.googleapis.com ajax.aspnetcdn.com; style-src'self'; img-src'self'; font-src'self'; report-uri /WebResource.axd?cspReport=true

以下是Chrome浏览器控制台中的错误:

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". 
Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.

window.Modernizr.injectElementWithStyles   - modernizr-2.7.2.js:134
window.Modernizr.tests.touch               - modernizr-2.7.2.js:457(anonymous function)
modernizr-2.7.2.js:949(anonymous function) - modernizr-2.7.2.js:1406
Run Code Online (Sandbox Code Playgroud)

我在Github Modernizr网站上发现了以下解决方法.但是,解决方法是在3月份首次提出并做了一点Google-Fu,我找不到解决此问题的方法或解决方法.

我知道我可以包含unsafe-inline指令,它可以解决这个错误,但这也使得不安全的代码能够运行并且首先取消CSP的使用.有没有人有任何解决方案?

更新 - 什么是CSP

CSP是所有主流浏览器(包括Edge)支持的HTTP头.基本上它是允许浏览器用于呈现页面的白色内容列表.在这里了解更多信息在此处此处阅读Mozilla的CSP文档.

更新 - 帮助突出显示CSP

CSP现在可以在所有浏览器上使用(Edge添加支持,是的!)以及它在Web安全性方面的巨大飞跃.对于那些有兴趣获得更多第三方支持CSP的人,请参阅以下内容:

  1. Modernizr对CSP的支持
  2. Visual Studio支持CSP.请注意,如果您启用了CSP,则浏览器链接不起作用,因为它使用内联JavaScript.
  3. Visual Studio Web Essentials Extension对CSP的支持.Web Essentials是一个Visual Studio插件,其功能通常最终出现在Visual Studio的下一个版本中.

kra*_*etz 5

我怀疑除了重写使用内联代码或动态评估代码(适用于JS和CSS)的Modernizr部分之外,没有其他解决方案.AngularJS ngCsp的经验可能在这里很有用.