CSPViolationReportBody: originalPolicy 属性

CSPViolationReportBody 接口的只读属性 originalPolicy 是一个字符串,表示导致违规的 内容安全策略 (CSP)

这是 Content-Security-Policy HTTP 响应头中的字符串,其中包含定义 CSP 策略的 指令及其值。请注意,这与 effectiveDirective 不同,effectiveDirective 是实际被违反的具体指令(如果使用了 default-src,则该指令可能并未在策略中明确列出)。

一个表示导致违规的策略的字符串。

示例

CSP 内联脚本违规

此示例使用内联脚本触发 CSP 违规,并使用 ReportingObserver 报告违规。特别是,它会记录 effectiveDirectiveoriginalPolicy,从而使它们之间的区别更加清晰。

HTML

下面的 HTML 文件使用 <meta> 元素将 Content-Security-Policydefault-src 设置为 self,这允许从同一域加载脚本和其他资源,但不允许执行内联脚本。该文档还包含一个内联脚本,这应该会触发 CSP 违规。

html
<!doctype html>
<html lang="en">
  <head>
    <meta
      http-equiv="Content-Security-Policy"
      content="default-src 'self'; report-to csp-endpoint" />
    <!-- This is the (original) CSP policy -->
    <meta
      http-equiv="Reporting-Endpoints"
      content="csp-endpoint='https://example.com/csp-reports'" />
    <script src="main.js"></script>
    <title>CSP: Violation due to inline script</title>
  </head>
  <body>
    <h1>CSP: Violation due to inline script</h1>
    <script>
      const int = 4;
    </script>
  </body>
</html>

JavaScript (main.js)

上面的文档还加载了外部脚本 main.js,如下所示。由于它是从与 HTML 相同的域加载的,因此不会被 CSP 阻止。

脚本创建一个新的 ReportingObserver 来观察类型为 "csp-violation" 的内容违规报告。每次调用回调函数时,我们都会获取报告数组的第一个条目的主体,并使用它将违规的 effectiveDirectiveoriginalPolicy 记录到控制台。

js
// main.js
const observer = new ReportingObserver(
  (reports, observer) => {
    console.log(`effectiveDirective: ${reports[0].body.effectiveDirective}`);
    // effectiveDirective: script-src-elem
    console.log(`originalPolicy: ${reports[0].body.originalPolicy}`);
    // originalPolicy: default-src 'self'; report-to csp-endpoint
  },
  {
    types: ["csp-violation"],
    buffered: true,
  },
);

observer.observe();

请注意,虽然返回的数组中可能有多份报告,但为了简洁起见,我们只记录第一个元素的这些值。

结果

上述代码的控制台输出为:

effectiveDirective: script-src-elem
originalPolicy: default-src 'self'; report-to csp-endpoint

请注意,originalPolicy 与 HTML 中 Content-Security-Policy 指令的 <meta> 内容匹配,并指定默认策略为 self (default-src 'self')。

effectiveDirectivescript-src-elem,它指定了 JavaScript <script> 元素的有效来源。尽管策略中设置了 default-src,但这是实际被违反的具体指令。

规范

规范
内容安全策略级别 3
# dom-cspviolationreportbody-originalpolicy

浏览器兼容性

另见