更新到 Angular 12 在 chrome 扩展中导致 CSP 不安全评估错误答案

【问题标题】：Update to angular 12 gives CSP unsafe-eval error in chrome extention更新到 Angular 12 在 chrome 扩展中导致 CSP 不安全评估错误
【发布时间】：2021-09-09 23:03:02
【问题描述】：

我有一个使用 angular 11 的工作 chrome 扩展。我刚刚将它更新到 12，现在我得到了

拒绝执行内联事件处理程序，因为它违反了以下内容安全策略指令：“script-src 'self' 'unsafe-eval'"。'unsafe-inline'关键字，一个哈希 ('sha256-...') 或 nonce ('nonce-...') 需要启用内联执行。请注意，哈希不适用于事件处理程序、样式属性和 javascript：导航，除非“不安全哈希” 关键字存在。

所以，我认为如果它曾经在 Angular 11 中工作，那么应该可以让它在 Angular 12 中工作。

所以，在我的清单中我已经有了：

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'

我尝试将unsafe-hashes 添加到 Angular 的 index.html 中

<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self' 'unsafe-inline' 'unsafe-hashes' 'sha256-oFP6B0o0upf5CwDxtOuL0J68WAdmyZUBtL/g8VBQ9wE='; style-src 'self'; base-uri 'self';">

但这并不能解决该错误（甚至更多错误）

它是一个公共仓库，有更新的分支可以找到here

有什么建议可以解决这个问题吗？

【问题讨论】：

找到一种方法来配置 Angular，使其不使用 unsafe-eval。

标签： angular google-chrome-extension content-security-policy

【解决方案1】：

在post 中，我找到了解决问题的方法

然后运行生产构建

$> ng build --configuration production

它有效 :) 如果有更好的解决方案，请告诉我！

【讨论】：