Angular >= 8 的内容安全策略答案

【问题标题】：Content Security Policy with Angular >= 8Angular >= 8 的内容安全策略
【发布时间】：2020-11-04 23:46:15
【问题描述】：

如何正确实现 Angular >= 8 的 CSP（内容安全策略）？

我尝试过类似的方法：

<meta http-equiv="Content-Security-Policy" content="script-src 'self'; style-src 'self'; img-src 'self';" />

在控制台上，我收到以下错误：

为了编译，我使用了以下选项但没有成功：

npm build --prodnpm run build --prodnpm build --aot --prod

【问题讨论】：

更改script-src 'self' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self';中的meta内容
这样，我不是让安全失效了吗？我正在尝试提高成绩：securityheaders.com
是的，我想是的。我遇到了同样的问题。我像在https://stackoverflow.com/questions/62654694/using-angular-material-with-strict-content-security-policy 中写的那样解决了它。
我们可以断定这些安全策略目前不受支持吗？
是的，它们受支持，但您必须以稍微不同的方式工作才能使它们正常工作。就像我在上一个答案中所说的，您必须将所有样式导入单个 css 文件并删除所有

标签： angular content-security-policy

【解决方案1】：

您可以在“self”源旁边设置自己的源，专门用于字体和图标

&lt;meta http-equiv="Content-Security-Policy" content="script-src 'self' https://kit.fontawesome.com 'nonce-YLMZop38Ktla8/hmmA==' 'unsafe-eval' ;style-src  'self' 'unsafe-inline' https://fonts.googleapis.com https://maxcdn.bootstrapcdn.com https://cdn.syncfusion.com; "&gt;

【讨论】：

【解决方案2】：

添加元标记

<meta http-equiv="Content-Security-Policy" content="YOUR_CSP">

在 index.html 文件的头部

【讨论】：

问题不在于如何以及在何处放置 CSP 元标记。