dom / latest / rtcrtpsender / replacetrack.html /

RTCRtpSender.replaceTrack()

The RTCRtpSender method replaceTrack() replaces the track currently being used as the sender's source with a new MediaStreamTrack.

The new track must be of the same media kind (audio, video, etc) and switching the track should not require negotiation.

Among the use cases for replaceTrack() is the common need to switch between the rear- and front-facing cameras on a phone. With replaceTrack(), you can have a track object for each camera and switch between the two as needed. See the example Switching cameras below.

Syntax

trackReplacedPromise = sender.replaceTrack(newTrack);

Parameters

newTrack Optional

A MediaStreamTrack specifying the track with which to replace the RTCRtpSender's current source track. The new track's kind must be the same as the current track's, or the replace track request will fail.

Return value

A Promise which is fulfilled once the track has been successfully replaced. The promise is rejected if the track cannot be replaced for any reason; this is commonly because the change would require renegotiation of the codec, which is not allowed (see Things that require negotiation).

If newTrack was omitted or was null, replaceTrack() stops the sender. No negotiation is required in this case.

When the promise is fulfilled, the fulfillment handler receives a value of undefined.

Exceptions

If the returned promise is rejected, one of the following exceptions is provided to the rejection handler:

InvalidModificationError DOMException

Returned if replacing the RTCRtpSender's current track with the new one would require negotiation.

InvalidStateError DOMException

Returned if the track on which this method was called is stopped rather than running.

TypeError DOMException

Returned if the new track's kind doesn't match the original track.

Usage notes

Things that trigger negotiation

Not all track replacements require renegotiation. In fact, even changes that seem huge can be done without requiring negotiation. Here are the changes that can trigger negotiation:

  • The new track has a resolution which is outside the bounds of the current track; that is, the new track is either wider or taller than the current one.
  • The new track's frame rate is high enough to cause the codec's block rate to be exceeded.
  • The new track is a video track and its raw or pre-encoded state differs from that of the original track.
  • The new track is an audio track with a different number of channels fom the original.
  • Media sources that have built-in encoders — such as hardware encoders — may not be able to provide the negotiated codec. Software sources may not implement the negotiated codec.

Examples

Switching video cameras

// example to change video camera, suppose selected value saved into window.selectedCamera

navigator.mediaDevices
  .getUserMedia({
    video: {
      deviceId: {
        exact: window.selectedCamera
      }
    }
  })
  .then(function(stream) {
    let videoTrack = stream.getVideoTracks()[0];
    PCs.forEach(function(pc) {
      var sender = pc.getSenders().find(function(s) {
        return s.track.kind == videoTrack.kind;
      });
      console.log('found sender:', sender);
      sender.replaceTrack(videoTrack);
    });
  })
  .catch(function(err) {
    console.error('Error happens:', err);
  });

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
replaceTrack
65
79
34
No
52
11
65
65
34
47
11
9.0

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/RTCRtpSender/replaceTrack