

本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

# 在 Amazon Chime 软件开发工具包客户端库中使用内容安全策略 JavaScript
<a name="content-security"></a>

现代 Web 应用程序使用内容安全策略保护用户免受某些类别的攻击。使用 `VideoFxProcessor` 的应用程序必须包含本节描述的策略指令。这些指令允许 Amazon Chime SDK 在运行时访问其所需的资源。

**Topics**
+ [所需的内容安全策略指令](#required-csp)
+ [内容安全策略示例](#example-csp)
+ [内容安全策略错误](#csp-errors)
+ [跨源开启器内容安全政策](#cross-origin-policy)

## 所需的内容安全策略指令
<a name="required-csp"></a>

您必须使用以下内容安全策略指令。
+ 对于 `script-src:`，添加 `blob: https://*.sdkassets.chime.aws` 以加载视频处理代码，并添加 `wasm-unsafe-eval` 以允许运行该代码。
+ 对于 `script-src-elem:`，添加 `blob:` `https://*.sdkassets.chime.aws` 以从来源加载视频处理代码。
+ 用于`worker-src:``blob: https://*.sdkassets.chime.aws`添加 JavaScript 跨源加载工作人员。

如果您忽略这些条目中的任何一个，或者您使用 HTTP 标头和 `http-equiv` 元标签指定策略，但意外通过交叉排除其中任何一个条目，则背景筛选器将无法初始化。该筛选器似乎不受支持，或者创建了一个无操作视频帧处理器。您将在浏览器控制台中看到错误，例如：

```
Refused to connect to
'https://static.sdkassets.chime.aws/bgblur/workers/worker.js…'
because it violates the document's content security policy.
```

### 必需的脚本策略指令
<a name="required-script"></a>

要正常运行，该`VideoFxProcessor`类必须在运行时从 Amazon 内容分发网络加载 JavaScript 类。这些类使用 Web GL2 实现视频的后期处理。要允许应用程序获取和运行这些类别，必须包含以下指令：
+ `script-src 'self' blob: https://*.sdkassets.chime.aws`
+ `script-src-elem 'self' blob: https://*.sdkassets.chime.aws`

**注意**  
要在 Safari 和 Firefox 上获得全面支持，必须使用 `script-src` 和 `script-src-elem` 指令。

### 工作线程策略指令
<a name="required-worker"></a>

将 JavaScript 类作为 blob `VideoFxProcessor` 加载以运行 Web 工作线程。该线程使用机器学习模型处理视频。要授予应用程序获取和使用此工作线程的访问权限，请包含以下指令：

`worker-src 'self' blob: https://*.sdkassets.chime.aws`

### WebAssembly 政策
<a name="required-web-assembly"></a>

从亚马逊拥有的同一个内容交付网络`VideoFxProcessor`加载一个 WebAssembly (WASM) 模块。在 Chrome 95 及更高版本中，编译后的 WASM 模块无法跨越多个模块边界。要允许获取和实例化这些模块，请在 `script-src` 指令中包含 `'wasm-unsafe-eval'`。

有关内容安全政策文档的更多信息 WebAssembly，请参阅上的[WebAssembly 内容安全政策](https://github.com/WebAssembly/content-security-policy/blob/main/proposals/CSP.md) GitHub。

### （可选）背景图片策略指令
<a name="optional-directives"></a>

要将动态加载的背景图像与背景替换筛选器一起使用，`VideoFxProcessor` 必须能够访问该图像。为此，请在托管图像的域中加入 `connect-src` 指令。

## 内容安全策略示例
<a name="example-csp"></a>

以下示例策略允许使用 `VideoFxProcessor`。`connect-src` 定义并不特定于 `VideoFxProcessor`。相反，它们与 Amazon Chime SDK 会议中的音频和视频有关。

```
<head>
    <meta http-equiv="Content-Security-Policy" 
        content="base-uri 'self';    
        connect-src       'self' https://*.chime.aws wss://*.chime.aws https://*.amazonaws.com wss://*.chime.aws https://*.ingest.chime.aws;
        script-src        'self' blob: 'wasm-unsafe-eval' https://*.sdkassets.chime.aws; 
        script-src-elem   'self' blob: https://*.sdkassets.chime.aws;
        worker-src        'self' blob: https://*.sdkassets.chime.aws;">
</head>
```

## 内容安全策略错误
<a name="csp-errors"></a>

如果省略任何必需指令，则 `VideoFxProcessor` 不会实例化且将不受支持。在这种情况下，浏览器控制台中会出现以下（或类似）错误：

```
Refused to connect to
'https://static.sdkassets.chime.aws/ml_media_fx/otherassets/worker.js'
because it violates the document's content security policy.
```

## 跨源开启器内容安全政策
<a name="cross-origin-policy"></a>

为了限制内存使用量，该模块倾向于使用 `SharedArrayBuffer` 进行处理。但是，这需要您仔细配置 Web 安全。在为应用程序 HTML 提供服务时，必须设置以下标头：

```
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
```

服务器必须设置这些，因为它们没有等效元标签。如果您不设置这些标头，则背景筛选器可能会占用稍多的 RAM。

背景筛选器可以是 CPU 密集型，也可以是 GPU 密集型。某些移动设备和低规格笔记本电脑或台式机可能无法同时运行筛选器和多个视频流。