IntegrityViolationReportBody

实例属性

blockedURL 只读

一个字符串，表示被强制执行的完整性策略所阻止的资源的 URL（或仅为 reportOnly 策略报告的资源）。

documentURL 只读

一个字符串，表示尝试加载资源的文档的 URL。

destination 只读

一个字符串，指示被阻止资源的 Request.destination。当前只能是 "script"。

reportOnly 只读

一个布尔值：如果策略已执行，则为 false；如果仅报告了违规，则为 true。

描述

当文档尝试加载不符合使用 Integrity-Policy 或 Integrity-Policy-Report-Only HTTP 标头设置的策略的 Subresource Integrity 保证的资源时，会报告完整性策略违规。

具体来说，当文档尝试加载一个 <script> 资源（或策略中列出的其他 请求目标）且该资源没有有效的完整性元数据，或者以 no-cors 模式发出请求时，会发送报告。

在违规文档中，可以使用 ReportingObserver 回调（在 ReportingObserver() 构造函数中定义）来获取违规报告，通过过滤 type 为 "integrity-violation" 的报告对象来实现。

违规报告也可以作为 JSON 对象通过 POST 请求发送到 endpoints，这些端点在 Integrity-Policy 和 Integrity-Policy-Report-Only 标头中指定。JSON 报告对象是对 ReportingObserver 返回的报告的序列化，因此也具有 type 为 "integrity-violation"，以及一个 body 属性，该属性是此对象的序列化。请注意，策略中设置的端点值必须与使用 Reporting-Endpoints 标头设置的标识符进行映射。

示例

使用 API 进行报告

此示例演示了如何使用 ReportingObserver 获取完整性策略违规报告。

首先，我们使用 Integrity-Policy 设置页面的完整性策略。下面的策略报告并阻止加载任何未指定 integrity 属性的 <script> 元素或 HTMLScriptElement 对象，或者在 no-cors 模式下请求脚本资源时。请注意，在本示例中，我们只关心通过 API 报告违规，因此我们省略了报告端点。

Integrity-Policy: blocked-destinations=(script)

接下来，我们假设我们的页面包含以下元素来加载脚本。因为我们想触发一个违规，所以省略了用于检查脚本是否符合我们预期版本的 integrity 属性。我们也可以省略 cross-origin 属性，这样请求就会以 no-cors 模式发送。

<script
  src="https://example.com/example-framework.js"
  crossorigin="anonymous"></script>

<script
  src="https://example.com/example-framework.js"
  crossorigin="anonymous"></script>

为了在页面内观察违规，我们构建一个新的 ReportingObserver 对象来监听 "integrity-violation" 类型的报告，传递一个会接收并记录报告的回调函数。这段代码需要在导致违规的脚本之前，在同一页面中加载。

const observer = new ReportingObserver(
  (reports, observer) => {
    reports.forEach((violation) => {
      console.log(violation);
      console.log(JSON.stringify(violation));
    });
  },
  {
    types: ["integrity-violation"],
    buffered: true,
  },
);

observer.observe();

上面，我们记录了每个违规报告对象以及对象的 JSON 字符串版本，这可能看起来与下面的对象相似。

{
  "type": "integrity-violation",
  "url": "https://example.com",
  "body": {
    "documentURL": "https://example.com",
    "blockedURL": "https://example.com/example-framework.js",
    "destination": "script",
    "reportOnly": false
  }
}

将报告发送到报告端点

将网页配置为将完整性策略违规报告发送到 报告服务器端点 与前面的示例非常相似。

主要区别在于，我们需要使用 Reporting-Endpoints 响应标头指定一个或多个要将报告发送到的报告端点，然后在设置策略时在 endpoints 字段中引用它们。

您可以在下方看到，我们首先定义了两个端点 — integrity-endpoint 和 backup-integrity-endpoint — 然后在我们的策略中引用它们。

Reporting-Endpoints: integrity-endpoint=https://example.com/integrity, backup-integrity-endpoint=https://report-provider.example/integrity
Integrity-Policy: blocked-destinations=(script), endpoints=(integrity-endpoint, backup-integrity-endpoint)

我们可以通过从页面加载一个不符合子资源完整性指南的外部脚本来触发违规。为了与前面的示例有所不同，这里我们以 no-cors 模式发送请求。

<script
  src="https://example.com/example-framework.js"></script>

然后，违规报告将作为 JSON 文件发送到指定的端点。从下面的示例中可以看到，type 是 "integrity-violation"，body 属性是此 IntegrityViolationReportBody 对象的序列化。

在这种情况下，报告将与我们上一个示例中的 JSON 报告相同。

{
  "type": "integrity-violation",
  "url": "https://example.com",
  "body": {
    "documentURL": "https://example.com",
    "blockedURL": "https://example.com/example-framework.js",
    "destination": "script",
    "reportOnly": false
  }
}

规范

浏览器兼容性

另见

• ReportingObserver
• Integrity-Policy
• Integrity-Policy-Report-Only
• Reporting-Endpoints
• Integrity Policy 在 Subresource Integrity 中
• Reporting API