RTCPeerConnection: track 事件

track 事件在将新的轨道添加到连接的一部分的 RTCRtpReceiver 之后发送到 RTCPeerConnection 上的 ontrack 事件处理程序。

在传递此事件时，新的轨道已完全添加到对等连接中。有关详细信息，请参阅 轨道事件类型。

此事件不可取消，也不会冒泡。

语法

在诸如 addEventListener() 的方法中使用事件名称，或设置事件处理程序属性。

js
addEventListener("track", (event) => {});

ontrack = (event) => {};

事件类型

一个 RTCTrackEvent。继承自 Event。

Event RTCTrackEvent

事件属性

由于 RTCTrackEvent 基于 Event，因此其属性也可使用。

receiver 只读

已添加到 RTCPeerConnection 的轨道的 RTCRtpReceiver。

streams 只读 可选

一个 MediaStream 对象数组，每个对象代表一个已添加的 track 所属的媒体流。默认情况下，数组为空，表示无流轨道。

track 只读

已添加到连接的 MediaStreamTrack。

transceiver 只读

新轨道正在使用的 RTCRtpTransceiver。

示例

此示例显示创建新的 RTCPeerConnection，然后添加新的 track 事件处理程序的代码。

js
pc = new RTCPeerConnection({
  iceServers: [
    {
      urls: "turn:fake.turnserver.url",
      username: "someusername",
      credential: "somepassword",
    },
  ],
});

pc.addEventListener(
  "track",
  (e) => {
    videoElement.srcObject = e.streams[0];
    hangupButton.disabled = false;
  },
  false,
);

事件处理程序将新轨道的第一个流分配给现有的 <video> 元素，该元素使用变量 videoElement 标识。

您还可以将事件处理程序函数分配给 ontrack 属性，而不是使用 addEventListener()。

js
pc.ontrack = (e) => {
  videoElement.srcObject = e.streams[0];
  hangupButton.disabled = false;
  return false;
};

规范

规范
WebRTC：浏览器中的实时通信
# event-track

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。