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

Question

我正在尝试在测试站点上使用新的内容安全策略 (CSP) HTTP header 。当我将 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

我发现了 following workaround在 Github Modernizr 网站上。但是，解决方法是在 3 月份首次提出的，我在 Google 上搜索了一下，找不到解决此问题的方法或解决方法。

我知道我可以包含 unsafe-inline 指令，它可以绕过这个错误，但这也会让不安全的代码运行并首先否定 CSP 的使用。有没有人有任何解决方案？

更新 - 什么是 CSP

CSP 是所有主流浏览器都支持的 HTTP header (Including Edge)。本质上，它是允许浏览器用于呈现页面的内容白名单。了解更多 here或阅读 Mozilla 的 CSP 文档 here和 here .

更新 - 帮助突出显示 CSP

CSP 现已在 all browsers 上可用(Edge 添加了支持，耶!)这是网络安全方面的巨大飞跃。对于那些有兴趣为 CSP 获得更多第三方支持的人，请参阅以下内容:

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

Answer 1

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