Accessing MediaStream objects for Subscribers

You can access the MediaStream object used by a Subscriber. The HTMLVideoElement object (in the videoElementCreated event dispatched by the Subscriber, described in the previous section), has a srcObject property. This is the MediaStream object for the Subscriber's audio-video stream. You can use that MediaStream object as the source MediaStream for another Video element (as its srcObject property):

session.on('streamCreated', function(event) {
  const subscriber = session.subscribe(event.stream, { insertDefaultUI: false });
  subscriber.on('videoElementCreated', event => {
    // myVideoElement is a Video element you have created:
    myVideoElement.srcObject = event.element.srcObject;
  });
});

In a routed session that uses Adaptive Media Routing, the MediaStream for a subscriber can change when the session switches from relayed to routed streams (see this Help Center knowledge base article). Add an event listener for the play event for a Subscriber object's Video element to get the updated MediaStream instance:

session.on('streamCreated', function(event) {
  const subscriber = session.subscribe(event.stream, { insertDefaultUI: false });
  subscriber.on('videoElementCreated', event => {
    // myVideoElement is a Video element you have created:
    myVideoElement.srcObject = event.element.srcObject;
    myVideoElement.play()
    event.element.addEventListener('play', () => {
      // The MediaStram has changed
      myVideoElement.srcObject = event.element.srcObject;
      myVideoElement.play();
    });
  });
});