I am not able to receive remote video stream

Question

I am using google chrome 21.x on linux , webrtc peer connection gets established but am not able to receive any remote video stream, the callback given to the peerconnection ".onaddstream" never gets invoked, can some body advise where i need to look ?

I am pasting my entire code, still not able to receive the remote video stream, neither there are any errors.

var peerConnCreated = false;
var peerConn = null;
var cameraOn = false;
var clientId = 0;
var svcName = "";
var clientIdRecvd = false;
var myname = "";
var hisname = "";
var myJsep;
var hisJsep;
var mySdp;
var hisSdp;

function login()
{
    var loginid = document.getElementById("login").value;
    var jsonText = {"clientid":clientId, "service":"rtc", "mtype": "online", "username": loginid};
    myname = loginid;
    socket.send(JSON.stringify(jsonText));
}

function iceCallback(canditate, moreToFollow)
{
    if(canditate) {
        console.log("ice canditate");
        var jsonText = {"clientid":clientId, "service":"rtc", "mtype": "canditate", "sndr": myname, "rcpt": hisname, 
            "label": canditate.label, "cand": canditate.toSdp()};
        socket.send(JSON.stringify(jsonText));
    }
}

function onSessionConnecting(message)
{
    console.log("session connecting ...");
}

function onRemoteStreamRemoved(event)
{
    console.log("remote stream removed");
    remotevid.src = "";
}

function onSessionOpened(message)
{
    console.log("session opened");
}

function onRemoteStreamAdded(event)
{
    console.log("remote stream added");
    remotevid.src = window.webkitURL.createObjectURL(event.stream);
    remotevid.style.opacity = 1;
}

function createPeerConnection()
{
    if (peerConnCreated) return;
    peerConn = new webkitPeerConnection00("STUN stun.l.google.com:19302", iceCallback); 
    peerConn.onconnecting = onSessionConnecting;
    peerConn.onopen = onSessionOpened;
    peerConn.onaddstream = onRemoteStreamAdded;
    peerConn.onremovestream = onRemoteStreamRemoved;
    console.log("peer connection created");
    peerConnCreated = true;
}

function turnOnCameraAndMic()
{
    navigator.webkitGetUserMedia({video:true, audio:true}, successCallback, errorCallback);
    function successCallback(stream) {
        sourcevid.style.opacity = 1;
        sourcevid.src = window.webkitURL.createObjectURL(stream);
        peerConn.addStream(stream);
        console.log("local stream added");
    }
    function errorCallback(error) {
        console.error('An error occurred: [CODE ' + error.code + ']');
    }
    cameraOn = true;
}

function dialUser(user)
{
    if (!peerConnCreated) createPeerConnection();
    hisname = user;
    var localOffer = peerConn.createOffer({has_audio:true, has_video:true});
    peerConn.setLocalDescription(peerConn.SDP_OFFER, localOffer);
    mySdp =  peerConn.localDescription;
    myJsep = mySdp.toSdp();
    var call = {"clientid":clientId, "service":"rtc", "mtype": "call", "sndr": myname, "rcpt": hisname, "jsepdata": myJsep};
    socket.send(JSON.stringify(call));
    console.log("sent offer");
    //console.log(myJsep);
    peerConn.startIce();
    console.log("ice started ");
}

//handle the message from the sip server
//There is a new connection from our peer so turn on the camera 
//and relay the stream to peer.
function handleRtcMessage(request)
{
    var sessionRequest = eval('(' + request + ')');
    switch(sessionRequest.mtype) 
    {
        case 'online':
            console.log("new user online");
            var newuser = sessionRequest.username;
            var li = document.createElement("li");
            var name = document.createTextNode(newuser);
            li.appendChild(name);
            li.onclick = function() { dialUser(newuser); };
            document.getElementById("Contact List").appendChild(li);
            break;

        case 'call':
            console.log("recvng call");
            alert("Incoming call ...");
            if (!peerConnCreated) createPeerConnection();
            peerConn.setRemoteDescription(peerConn.SDP_OFFER, new SessionDescription(sessionRequest.jsepdata));
            hisname = sessionRequest.sndr;
            var remoteOffer = peerConn.remoteDescription;
            //console.log("remoteOffer" + remoteOffer.toSdp());
            var localAnswer = peerConn.createAnswer(remoteOffer.toSdp(), {has_audio:true, has_video:true}); 
            peerConn.setLocalDescription(peerConn.SDP_ANSWER, localAnswer);
            var jsonText = {"clientid":clientId,"service":"rtc", "mtype": "pickup", "sndr" :myname, "rcpt": hisname, "jsepdata": localAnswer.toSdp()};
            socket.send(JSON.stringify(jsonText));
            console.log("sent answer");
            //console.log(localAnswer.toSdp());
            peerConn.startIce();
            if (!cameraOn) turnOnCameraAndMic();
            break;

        case 'pickup':
            console.log("recvd pickup");
            peerConn.setRemoteDescription(peerConn.SDP_ANSWER, new SessionDescription(sessionRequest.jsepdata));
            hisname = sessionRequest.sndr;
            if (!cameraOn) turnOnCameraAndMic();
            break;

        case 'canditate':
            console.log("recvd canditate");
            var canditate = new IceCandidate(sessionRequest.label, sessionRequest.cand);
            peerConn.processIceMessage(canditate);
            break;

        case 'bye':
            console.log("recvd bye");
            break;
    }
}

//open the websocket  to the antkorp webserver
var socket = new WebSocket('ws://bldsvrub:9981');
var sourcevid = null;
var remotevid = null;

socket.onopen = function () {
    console.log("websocket opened");
    sourcevid = document.getElementById("sourcevid");
    remotevid = document.getElementById("remotevid");
};

socket.onmessage = function (event) { 
    if (!clientIdRecvd) {
        var reqObj = eval('(' + event.data + ')');
        clientId = reqObj.clientid;
        svcName  = reqObj.service;
        clientIdRecvd = true;
    } else {
        //hookup the new handler to process session requests
        handleRtcMessage(event.data);
    }
};

socket.onclose = function (event) { socket = null; };

Answer 1

the above code pasted contains a small bug, the stream should be added to the peer connection before generating the answer or offer , that is "addStream" should be called before any of setlocalDescription or setRemoteDescription calls.

Answer 2

Many WebRTC Demos:

• https://github.com/muaz-khan/WebRTC-Experiment

E.g. one-to-one WebRTC audio/video/screen calls:

• https://github.com/muaz-khan/WebRTC-Experiment#one-to-one-calls

Note:

This question is TOOO-Old. That's why I don't think I should add a working snippet code snippet here. Above link answers all the questions.

However, if you're NEW-WebRTC user and you're facing similar issues then here are some hints:

• Before creating peers, make sure that both peers are ready for the handshake.
• Ready means, both peers are having access to media streams (audio and/or video)
• First peer should initiate RTCPeerConnection object, call "addStream" and create offer-descriptions.
• Second peer should receive OFFER-SDP from first peer.
• Second peer should initiate RTCPeerConnection object, call "addStream" and setRemoteDescription earlier before create ANSWER-description.
• Second peer should create ANSWER-SDP.
• First peer should get ANSWER-SDP and set-Remote-Descriptions.
• ICE-candidate-pairs should be exchanged in parallel to the above process.

You can find some tutorials here:

• https://www.webrtc-experiment.com/#documentations

Remember

This answer targets WebRTC-1.0. It isn't answering WebRTC-1.1 (ORTC) or newer versions.

Answer 3

onaddstream should be called upon the receipt of an answer that contains at least one stream. If you aren't getting the callback, make sure both setLocal and setRemoteDescription have been called and succeeded.