Angular 5 & CSP - 拒绝将字符串评估为 JavaScript，因为“unsafe-eval”不是允许的脚本来源答案

【问题标题】：Angular 5 & CSP - Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of scriptAngular 5 & CSP - 拒绝将字符串评估为 JavaScript，因为“unsafe-eval”不是允许的脚本来源
【发布时间】：2018-11-04 22:26:01
【问题描述】：

我目前正在尝试向使用 Angular 5 构建的应用程序引入内容安全策略。我目前正在我的 index.html 中使用 meta 标记实现 CSP，尽管我将来会更改它.我已将以下内容插入到我的应用中

<meta http-equiv="Content-Security-Policy" content="script-src 'self'; img-src 'self' data:;media-src 'self'; object-src 'self' data: 'unsafe-eval'; style-src 'self' https://fonts.googleapis.com 'unsafe-inline';">

这几乎满足了我的需求，但是当我部署到测试服务器时，浏览器控制台会给我以下消息：

未捕获的 EvalError：拒绝将字符串评估为 JavaScript，因为 'unsafe-eval' 不是以下允许的脚本来源内容安全策略指令：“script-src 'self'”。

好的，所以我需要将'unsafe-eval' 添加到script-src 指令中。这不是一个真正的问题，但它似乎让我担心记住 eval() 是邪恶的！

对于希望使用 CSP 的 Angular 5 应用程序，是否必须将 'unsafe-eval' 包含到 script-src 指令中？有没有办法可以保留防止使用eval() 的安全功能？ Angular 使用 eval() 时是否需要包含此内容。我假设 Content-Security-Policy 元标记的内容是正确的，尽管我确信情况可能并非如此。

我在 angular github https://github.com/angular/angular/issues/19142 上阅读了这个问题，但我不确定这个问题是否与我有关，因为我在我的应用程序中没有使用 SystemJS 而是 webpack？

非常感谢您的帮助、答案和建议。

【问题讨论】：

标签： angular content-security-policy

【解决方案1】：

我遇到了同样的问题，我注意到在 --prod 模式下运行不会出错（我使用的是 Angular 8）。

根据您的设置，您可以使用客户端响应标头来实施您的安全策略，因为这不会导致此错误。

如果您的问题仅与在调试模式下运行（使用元标记）有关，这不适合您。

【讨论】：