Back to Webrtc Experiment

WebSockets

websocket/index.html

latest3.1 KB
Original Source

Private ?? #123456789 Start Transmitting Yourself!

  1. Using WebSockets for signaling
  2. It is one-to-one peers connection

Latest Updates

Feedback

Send MessageEnter your email too; if you want "direct" reply!

How to use PeerConnection.js?

// http://www.webrtc-experiment.com/websocket/PeerConnection.js

var peer = new **PeerConnection** (' **ws://domain:port**');
peer. **onStreamAdded** = function(e) {
   document.body.appendChild(e.mediaElement);
};

// the easiest method of "manual" peers connection is
// call "sendParticipationRequest" and pass user-id of the target user
peer. **sendParticipationRequest** (userid);

//otherwise, call "startBroadcasting"
// (behind the scene) this function will be invoked
// recursively until a participant found
peer. **startBroadcasting** ();

Simplest Demo

var offerer = new **PeerConnection** (' **ws://domain:port**', ' **offerer**');
offerer. **onStreamAdded** = function(e) {
   document.body.appendChild(e.mediaElement);
};
var answerer = new **PeerConnection** (' **ws://domain:port**', ' **answerer**');
answerer. **onStreamAdded** = function(e) {
   document.body.appendChild(e.mediaElement);
};
answerer. **sendParticipationRequest** ( **'offerer'** );

getUserMedia is "in-your-own-hands"!

It is upto you to decide when to capture the stream; how to capture; and the quality of the stream.

function getUserMedia(callback) {
    var hints = {
        audio: true,
        video: {
            optional: [],

            // capture super-hd stream!
            mandatory: {
                minWidth: 1280,
                minHeight: 720,
                maxWidth: 1920,
                maxHeight: 1080,
                minAspectRatio: 1.77
            }
        }
    };

    navigator.getUserMedia(hints, function (stream) {
        // you can use "peer.addStream" to attach stream
        // peer.addStream(stream);
        // or peer.MediaStream = stream;

        callback(stream);

        // preview local video
        var video = document.createElement('video');
        video.srcObject = stream;
        video.controls = true;
        video.muted = true;

        peer.onStreamAdded({
            mediaElement: video,
            userid: 'self',
            stream: stream
        });
    });
}

Want to use WebSocket over Node.js?

var channel = location.href.replace(/\/|:|#|%|\.|\[|\]/g, '');
var websocket = new WebSocket('wss://yourdomain:port');
websocket.onopen = function () {
    websocket.push(JSON.stringify({
        open: true,
        channel: channel
    }));
};
websocket.push = websocket.send;
websocket.send = function (data) {
    websocket.push(JSON.stringify({
        data: data,
        channel: channel
    }));
};

// pass "websocket" object over the constructor instead of URL
var peer = new PeerConnection(websocket);

Check other signaling examples.