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);