DedicatedWorkerGlobalScope: postMessage() 方法

Baseline 已广泛支持

此特性已相当成熟,可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来,各浏览器均已提供此特性。

注意:此功能仅在 专用 Web Worker 中可用。

DedicatedWorkerGlobalScope 接口的 postMessage() 方法将消息发送给创建它的主线程。

此方法接受一个 data 参数,该参数包含要从 worker 复制到主线程的数据。数据可以是 结构化克隆 算法处理的任何值或 JavaScript 对象,包括循环引用。

该方法还接受一个可选的 可转移对象 数组,用于转移到主线程;与数据参数不同,转移的对象在 worker 线程中不再可用。(如果可能,对象使用高性能的零拷贝操作进行转移)。

创建 worker 的主作用域可以使用 Worker.postMessage 方法将信息发送回创建它的线程。

语法

js
postMessage(message)
postMessage(message, transfer)
postMessage(message, options)

参数

message

要传递给主线程的对象;这将在传递给 message 事件的数据字段中。这可以是 结构化克隆 算法处理的任何值或 JavaScript 对象,包括循环引用。

transfer 可选

一个可选的可传输对象数组,用于转移所有权。这些对象的所有权将转移到目标方,并且它们在发送方不再可用。这些可传输对象应该附加到消息中;否则它们将被移动,但在接收端实际上无法访问。

options 可选

一个包含以下属性的可选对象

transfer 可选

transfer 参数具有相同的含义。

返回值

无(undefined)。

示例

以下代码片段展示了 worker.js,其中使用 onmessage 处理程序来处理来自主脚本的消息。在处理程序内部,会进行计算,然后创建结果消息;该消息随后使用 postMessage(workerResult); 发送回主线程。

js
onmessage = (e) => {
  console.log("Message received from main script");
  const workerResult = `Result: ${e.data[0] * e.data[1]}`;
  console.log("Posting message back to main script");
  postMessage(workerResult);
};

在主脚本中,必须在 Worker 对象上调用 onmessage,而在 worker 脚本中,你只需要 onmessage,因为 worker 实际上就是全局作用域(DedicatedWorkerGlobalScope)。

如需完整示例,请参阅我们的 基本专用 Worker 示例运行专用 Worker)。

注意: postMessage() 一次只能发送一个对象。如上所示,如果要传递多个值,可以发送一个数组。

规范

规范
HTML
# dom-dedicatedworkerglobalscope-postmessage-dev

浏览器兼容性

另见

它所属的 DedicatedWorkerGlobalScope 接口。