WebRTC works locally, but not across different IP addresses

Question

My code is on Github at: https://github.com/rashadrussell/webrtc_experiment/blob/master/public/script.js

I am trying to write a 1-to-1 video video conferencing script with WebRTC. And is being stored on AppFog, a cloud hosting website. It works on my localhost when I test with two different Chrome windows on a single computer. It also works on AppFog when I test it on two different computers at home.

The problem occurs when I test my app with a friend living at a different house. The remote streams are not being set. My only guess is that there is some error with IP addresses, which means something is wrong my the setup of Ice Candidates. All that pops up is a black box where the remote stream is supposed to be.

Here is some of my code:

Client-Side

var isInitiator = false;


socket.on('initiatorFound', function(data) {
    isInitiator = data.setInitiator;
    console.log("Is Initiator? " + isInitiator);
});


navigator.getMedia = (
        navigator.getUserMedia ||
        navigator.webkitGetUserMedia ||
        navigator.mozGetUserMedia ||
        navigator.msGetUserMedia
    );

navigator.getMedia(
    {video: true, audio: false},
    (stream) => {
        var video = document.getElementById("localView");
        video.src = window.URL.createObjectURL(stream);
        console.log("Add Stream");
        sendMessage('streamAdd', {streamAdded: 'stream-added'});
        
        createPeerConnection();
        pc.addStream(stream);

        if(isInitiator)
        {
            callPeer();
        }
        
    },
    function(err) {
        console.log("The following error occured: ");
        console.dir(err);
    }

);


function sendMessage(type, message)
{
    console.log("Sending Message");
    socket.emit('message',{
        "type": type,
        "message": message
    });
}

function createPeerConnection() {

    pc = new rtcPeerConnection(servers, options);
    console.dir(pc);

    pc.onicecandidate = function(evt) {
        if(evt.candidate == null) return; 
        pc.onicecandidate = null;           

        console.log("Send Ice Candidate");
        sendMessage("iceCandidate", JSON.stringify(evt.candidate));
    };

    pc.onaddstream = function(evt) {
        document.body.append("");
        var remoteVid = document.getElementById("remoteVideo");
        remoteVid.src = window.URL.createObjectURL(evt.stream);
    };

}


function callPeer() {

    pc.createOffer(function (offer) {
            pc.setLocalDescription(offer, function() {
                sendMessage("offer", JSON.stringify(offer));
            });
            console.log("Send Offer");
        }, function(err) { console.log("Offer Error: " + err) },
            videoConstraints
        );

}

function answerPeer() {

    pc.createAnswer(function(answer) {
        pc.setLocalDescription(answer);
        sendMessage("answer", JSON.stringify(answer))
    }, function(err) { console.log("Sending Answer Error: " + err) },
        videoConstraints
    );

}

socket.on('message', function(message) {
    console.log("CONSOLE MESSAGE:");
    console.dir(message);

    if(message.type == 'streamAdd') {
        console.log('Stream was added');
        createPeerConnection();

        if(isInitiator) {
            callPeer();
        }

    } else if(message.type == 'offer') {

        pc.setRemoteDescription( new rtcSessionDescription(JSON.parse(message.message)));
        
        if(!isInitiator)
        {
            console.log("Sending Answer");
            answerPeer();
        }


    } else if(message.type == 'answer') {
        pc.setRemoteDescription( new rtcSessionDescription(JSON.parse(message.message)));
    } else if(message.type == 'iceCandidate') {
        console.log("Get Ice Candidate");
        pc.addIceCandidate(new rtcIceCandidate(JSON.parse(message.message)) );
    }

});

Server-Side

var isInitiator = false;
io.sockets.on('connection', function(socket) {

    if (!isInitiator) {
      isInitiator = true;
      socket.emit('initiatorFound', {setInitiator: isInitiator});
    } else {
      socket.emit('initiatorFound', {setInitiator: !isInitiator});
    }

    // Signaling Channel
    socket.on('message', function(message) {

      if (message.type == 'streamAdd') {
        console.log('Got message: ' + message);
      }
      //socket.emit('message' ,message);
      // Should be:
      socket.broadcast.emit('message', message);

    });

});

WebRTC works locally, but not across different IP addresses

Answers (1)

Related Questions