angular - 内容安全策略:Prod 模式下的 Angular 和 Spring Boot 应用程序

Question

我正在开发一个 Spring Boot 应用程序，并以 Angular 应用程序作为前端应用程序。后面我发CSP策略如上

.and()
            .headers()
            .contentSecurityPolicy(default-src 'self'; frame-src 'self'; script-src 'self' 'unsafe-inline' https://storage.googleapis.com; style-src 'self' 'unsafe-inline'; img-src 'self'; font-src 'self' object-src; require-trusted-types-for 'script')

当我在开发上运行应用程序并更改 CSP 策略时，我在 Angular 前端的控制台上收到错误，这是正常现象。当我在产品上运行应用程序时，即使我更改了 CSP 策略

default-src 'self'

应用程序继续运行，这很奇怪。

所以我的问题是:

1. Angular 从哪里获取代码的 CSP 策略？
2. 在生产模式下，我们可以制定 CSP 政策吗？

PS:我使用的是 Angular 版本 8.2.4

Answer 1

Where the Angular gets the CSP policy on the code?

正确的答案是 - 没有。 Angular 代码对 Content-Security-Policy header 不执行任何操作(也不应该知道)。 CSP header 是浏览器的指令，指示浏览器可以使用哪些资源以及可以使用哪些资源。

简单的例子:

Content-Security-Policy: default-src https:

当浏览器看到此指令时，它将拒绝从 HTTP 加载任何内容。如果您尝试从 HTTP 获取脚本，Angular 甚至不会启动，因为没有可用的脚本。

On prod mode, Can we have a CSP policy?

是的。 CSP 是一个非常有用的工具，可以极大地提高应用程序的安全性。因此，如果您关心您的客户，则应考虑 CSP(以及功能策略)。

但是设置起来非常耗时。我花了一两天的时间来找到最适合自己的组合。

尝试这个(不要忘记使用 google.api 进行调整):

default-src 'none'; img-src 'self' data:; font-src 'self'; connect-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; object-src 'none'

希望这有帮助!

更新

Here您可以找到有关 CSP 的更多信息(并以更好的方式编写)