MediaStream: removeTrack() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2017.

removeTrack() は MediaStream インターフェイスのメソッドで、ストリームから MediaStreamTrack を除去します。

構文

js
removeTrack(track)

引数

track

ストリームから除去される MediaStreamTrack です。

返値

なし (undefined)。

例

次の例は、 MediaStream から音声トラックと映像トラックを除去する方法を示しています。 fetchStreamFunction は、 fetchStreamButton のイベントハンドラーです。このボタンがクリックされると、システムの機器から音声と動画がキャプチャされます。 removeTracksFunction は、 removeTracksButton のイベントハンドラーです。このボタンがクリックされると、音声と映像トラックが MediaStream から除去されます。

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

  // ストリームが空になる
  console.log(newStream.getTracks());
}

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

仕様書

Specification
Media Capture and Streams
# dom-mediastream-removetrack

ブラウザーの互換性

BCD tables only load in the browser