addStream | RTCMultiConnection

addStream | RTCMultiConnection

Use this method to add additional streams in a LIVE session.

Do not call this method when you are alone in the room.

Table of contents

  1. Add camera and microphone
  2. Add screen
  3. Description
  4. Best practice
  5. Open data channels
  6. Share with single (unique) user
  7. Add external stream
  8. Try a demo (A demo is worth 1000 words!)
  9. Ask a question

Add camera and microphone

connection.addStream({
    audio: true,
    video: true,
    oneway: true
});

Add screen

connection.addStream({
    screen: true,
    oneway: true,
    streamCallback: function(stream) {
      console.log('Screen is successfully captured: ' + stream.getVideoTracks().length);
    }
});

Description

parameterdescription
audio share microphone
video share camera
screen select and share a screen
oneway only you will share; all others will merely receive it
streamCallback this callback is fired if stream is successfully captured.
use this callback to set stream-stop-listeners so that you can check if screen sharing is stopped etc.

Best practice

Always try to set sdpConstraints and mediaConstraints before calling "addStream" method:

connection.sdpConstraints.mandatory = {
    OfferToReceiveAudio: true,
    OfferToReceiveVideo: true
};

connection.mediaConstraints = {
    video: true,
    audio: true
};

connection.addStream({
    screen: true,
    oneway: true
});

Open data channels

You can enable text-chat or file-sharing in a LIVE video session:

connection.addStream({
    data: true
});

Share with single (unique) user

You can share with only one user rather than sharing with all connected users:

// runtime sharing of screen among two unique users
// one is you; and other is person whose id is given below
connection.peers['user-id'].addStream({
    screen: true,
    oneway: true
});

Add external stream

You can capture a stream yourself and share it using "addStream" method:

navigator.getDisplayMedia({
    video: true
}).then(externalStream => {
    connection.addStream(externalStream);
}, error => {
    alert(error);
});

Demo

<script src="https://rtcmulticonnection.herokuapp.com/dist/RTCMultiConnection.min.js"></script>
<script src="https://rtcmulticonnection.herokuapp.com/socket.io/socket.io.js"></script>

<hr><button id="share-video">Share Video</button><hr>

<script>
var connection = new RTCMultiConnection();

// this line is VERY_important
connection.socketURL = 'https://rtcmulticonnection.herokuapp.com:443/';

// if you want audio-only session
connection.session = {
    audio: true
};

connection.mediaConstraints = {
    video: false,
    audio: true
};

connection.sdpConstraints.mandatory = {
    OfferToReceiveAudio: true,
    OfferToReceiveVideo: true
};

connection.openOrJoin('your-room-id');

document.getElementById('share-video').onclick = function() {
    this.disabled = true;
    connection.mediaConstraints.video = true;
    connection.addStream({
        video: true,
        oneway: true
    });
};
</script>