RTCRtpScriptTransformer: options 属性

基准线 2025
新推出

自 2025 年 10 月起,此功能已在最新的设备和浏览器版本中可用。此功能可能不适用于较旧的设备或浏览器。

optionsRTCRtpScriptTransformer 接口的一个只读属性,它返回在 构造 相应的 RTCRtpScriptTransform 对象时(可选地)作为第二个参数传递的对象。

一个对象。

描述

options 最简单的用途是让主线程指示是否将相应的 RTCRtpScriptTransform 添加到 WebRTC 发送者或接收者管道。如果同一个 worker 用于处理传入和传出的编码帧,这一点很重要,因为它允许代码确定应该将哪个转换应用于这些帧。

options 还可以用于将 消息通道 的第二个端口发送/传输到 worker 端转换。然后,该通道可用于向转换流发送动态信息,例如在加密密钥更改或添加时。请注意,您也可以使用 Worker.postMessage() 向转换发送消息,但如果 worker 在不同上下文中使用了,您则必须适当地重定向消息(而消息端口选项为特定转换提供了一个直接通道)。

示例

如何指示当前 WebRTC 管道

RTCRtpScriptTransform 使用特定的 Worker 和 options 进行构造,然后通过将其分配给 RTCRtpSender.transformRTCRtpReceiver.transform,分别插入到 WebRTC 的传出或传入管道中。如果传入和传出管道的转换使用了同一个 worker,那么您需要在构造函数中提供 options 来指示要转换的编码帧是传入的还是传出的。

下面的示例展示了在将 track 添加到 peer connection(RTCPeerConnection)后,将其添加到发送者管道,然后在新 track 接收时,再将另一个转换添加到接收者管道的实现方式。

js
// videoSender is an RTCRtpSender.
const videoSender = peerConnection.addTrack(track, mediaStream);
videoSender.transform = new RTCRtpScriptTransform(worker, {
  name: "senderTransform",
});
js
peerConnection.ontrack = (event) => {
  // event.receiver is an RTCRtpReceiver
  event.receiver.transform = new RTCRtpScriptTransform(worker, {
    someOption: "receiverTransform",
  });
};

在上面的每种情况下,我们都提供了一个对象,其 options 对象的 name 属性具有不同的值,这表明转换被添加到的管道。请注意,options 中的属性名称和值是任意的:重要的是主线程和 worker 线程都知道使用了哪些属性和值。

以下代码展示了在 worker 中如何使用传递的 options。首先,我们实现一个 rtctransform 事件的处理器,该事件在构造相应的 RTCRtpScriptTransform 时,以及在将新帧排队处理时,在全局 worker 对象上触发。event.transformer 是一个 RTCRtpScriptTransformer,它具有 readablewritableoptions 属性。

js
addEventListener("rtctransform", (event) => {
  let transform;
  // Select a transform based on passed options
  if (event.transformer.options.name === "senderTransform")
    transform = createSenderTransform(); // A TransformStream
  else if (event.transformer.options.name === "receiverTransform")
    transform = createReceiverTransform(); // A TransformStream
  else return;

  // Pipe frames from the readable to writeable through TransformStream
  event.transformer.readable
    .pipeThrough(transform)
    .pipeTo(event.transformer.writable);
});

该代码创建一个不同的 TransformStream 来处理传出和传入的帧,根据传递的 options 使用 createSenderTransform()createReceiverTransform()(然后它会将帧从 readable 通过选定的 TransformStream 管道传输到 writable)。

将消息端口传递给转换

此示例展示了如何创建一个 消息通道,并将其中一个端口传输到 worker 中运行的 WebRTC 编码转换。然后,主线程可以在构造后将对象和消息发送/传输到 worker 中运行的转换器,反之亦然。

下面的代码首先创建一个 MessageChannel,然后构造一个 RTCRtpScriptTransform,将 port2 值作为 options 参数中的一个属性传递。该端口也包含在作为第三个构造函数参数传递的数组中,以便将其传输到 worker 上下文中。

js
const channel = new MessageChannel();

const transform = new RTCRtpScriptTransform(
  worker,
  { purpose: "encrypter", port: channel.port2 },
  [channel.port2],
);

然后,worker 可以从在全局 worker 对象上触发的 rtctransform 事件中获取该端口。

js
let messagePort;
addEventListener("rtctransform", (event) => {
  messagePort = event.transformer.options.port;
  // … other transformer code
});

通道两端的代码可以使用 MessagePort.postMessage() 发送和传输对象到另一端,并使用其 message 事件侦听传入的消息。

例如,假设我们在一个名为 encryptionKeyUint8Array 类型数组中有一个加密密钥,我们可以像这样将其从主线程传输到 worker:

js
const encryptionKeyBuffer = encryptionKey.buffer;
channel.port1.postMessage(encryptionKeyBuffer, [encryptionKeyBuffer]);

worker 将侦听 message 事件以获取密钥:

js
messagePort.addEventListener("message", (event) => {
  const encryptionKeyBuffer = event.data;
  // … Use the encryptionKeyBuffer for encryption or any other purpose
});

有关更多信息和示例,请参阅 消息通道

规范

规范
WebRTC Encoded Transform
# dom-rtcrtpscripttransformer-options

浏览器兼容性

另见