AudioWorkletNode:port 属性

基线 广泛可用

此功能已完善,并在许多设备和浏览器版本中都能正常运行。它从 2021 年 4 月.

报告反馈

安全上下文:此功能仅在 安全上下文(HTTPS)中可用,且仅在部分或所有 支持的浏览器 中可用。

AudioWorkletNode 接口的只读 port 属性返回关联的 MessagePort。它可用于在节点及其关联的 AudioWorkletProcessor 之间进行通信。

注意:通道另一端端口在处理器的 port 属性下可用。

示例

连接 AudioWorkletNode 及其关联的 AudioWorkletProcessorMessagePort 对象。

为了演示双向通信功能,我们将创建一个 AudioWorkletProcessor,它将输出静音并响应来自其 AudioWorkletNode 的 ping 请求。

首先,我们需要定义一个自定义 AudioWorkletProcessor 并将其注册。请注意,这应该在单独的文件中完成。
// ping-pong-processor.js
class PingPongProcessor extends AudioWorkletProcessor {
  constructor(...args) {
    super(...args);
    this.port.onmessage = (e) => {
      console.log(e.data);
      this.port.postMessage("pong");
    };
  }
  process(inputs, outputs, parameters) {
    return true;
  }
}

registerProcessor("ping-pong-processor", PingPongProcessor);

js

首先,我们需要定义一个自定义 AudioWorkletProcessor 并将其注册。请注意,这应该在单独的文件中完成。
const audioContext = new AudioContext();
await audioContext.audioWorklet.addModule("ping-pong-processor.js");
const pingPongNode = new AudioWorkletNode(audioContext, "ping-pong-processor");
// send the message containing 'ping' string
// to the AudioWorkletProcessor from the AudioWorkletNode every second
setInterval(() => pingPongNode.port.postMessage("ping"), 1000);
pingPongNode.port.onmessage = (e) => console.log(e.data);
pingPongNode.connect(audioContext.destination);

现在,在我们的主脚本文件中,我们将加载处理器,创建 AudioWorkletNode 的实例,传入处理器名称,并将节点连接到音频图。

规范

这将每秒将 "ping""pong" 字符串输出到控制台。
Web 音频 API
# 规范

浏览器兼容性

dom-audioworkletnode-port

参见