MediaStream: removeTrack() 方法

Baseline 已广泛支持

此功能已成熟，可跨多种设备和浏览器版本使用。自 2017 年 9 月以来，它已在浏览器中提供。

MediaStream 接口的 removeTrack() 方法从流中移除一个 MediaStreamTrack。

语法

removeTrack(track)

参数

track: 要从流中移除的 MediaStreamTrack。

以下示例演示如何从 MediaStream 中移除音频和视频轨道。fetchStreamFunction 是 fetchStreamButton 的事件处理程序。当点击该按钮时，会从系统的设备中捕获音频和视频。removeTracksFunction 是 removeTracksButton 的事件处理程序。当点击该按钮时，音频和视频轨道将从 MediaStream 中移除。

let initialStream = null;
let newStream = null;

let fetchStreamButton = document.getElementById("fetchStream");
let removeTracksButton = document.getElementById("removeTracks");

async function fetchStreamFunction() {
  initialStream = await navigator.mediaDevices.getUserMedia({
    video: { width: 620, height: 310 },
    audio: true,
  });
  if (initialStream) {
    await attachToDOM(initialStream);
  }
}

async function attachToDOM(stream) {
  newStream = new MediaStream(stream.getTracks());
  document.querySelector("video").srcObject = newStream;
}

async function removeTracksFunction() {
  let videoTrack = newStream.getVideoTracks()[0];
  let audioTrack = newStream.getAudioTracks()[0];

  newStream.removeTrack(videoTrack);
  newStream.removeTrack(audioTrack);

  // Stream will be empty
  console.log(newStream.getTracks());
}

fetchStreamButton.addEventListener("click", fetchStreamFunction);
removeTracksButton.addEventListener("click", removeTracksFunction);