1

阅读Angular 安全指南后，我想：

到目前为止，这是我更改index.html的方式：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline';" />
    <meta http-equiv="Content-Security-Policy" content="trusted-types angular angular#unsafe-bypass; require-trusted-types-for 'script';" />

现在，我的控制台中有很多错误：

This document requires 'TrustedScript' assignment.
FooService EvalError: Refused to evaluate a string as JavaScript because this document requires 'Trusted Type' assignment.

我的问题：

  • 是否可以定义Content-Security-Policy两次/两者：
    一个用于“经典”CSP 配置，一个用于受信任类型？
    是否有意义？
  • 它们如何相互关联？
  • 我如何使它在本地和生产中工作？
    • 我知道这个配置可能应该只在生产环境中激活（因为 JIT），
      使用特定的index.production.html文件（参见参考资料）。我不是只为两个元属性复制index.html
      的忠实粉丝......
    • 我还看到我可以在 my 中使用该headers属性architect.serve.configurations.production，
      但我不确定它是否更好和/或等效
  • 我什至应该使用trusted-types?
    Angular 安全指南推荐使用它，但仍处于试验阶段

我阅读了一些有趣的资源，但它们没有展示如何具体使用 CSP 属性。
我正在使用 Angular 13。

4

1 回答 1

0

您可以拥有多个 CSP。所有这些都将单独检查，您的内容需要通过所有策略。您可以将一个用于 CSP 2 级，一个用于 CSP 3 级（其中 2 级浏览器将忽略它不理解的指令）。

我建议将 CSP 设置为响应标头。每个环境的配置更简单，并且提供了更多功能，例如 report-uri 和 frame-ancestors。

受信任的类型增加了另一层安全性，如果可能，我会在掌握基本 CSP 后实现它。

于 2022-01-12T05:43:55.393 回答