index.html (Offerer)
var socket = io.connect('http://127.0.0.1:80'); //socket.io
socket.emit("player 1");
var iceServers = {
iceServers: [
{"url":"stun:turn1.xirsys.com"},
{"username":"myusername","url":"turn:turn1.xirsys.com:443?transport=udp","credential":"mycredential"},
{"username":"myusername","url":"turn:turn1.xirsys.com:443?transport=tcp","credential":"mycredential"}
]
};
var offererDataChannel, answererDataChannel;
var Offerer = {
createOffer: function () {
var peer = new PeerConnection(iceServers);
var dataChannelOptions = {
reliable: true,
ordered: false
};
offererDataChannel = peer.createDataChannel('channel', dataChannelOptions);
setChannelEvents(offererDataChannel);
peer.onicecandidate = function (event) {
if (event.candidate) {
socket.emit("candidate", event.candidate);
}
};
peer.createOffer(function (sdp) {
peer.setLocalDescription(sdp);
socket.emit("sdp", sdp);
}, function (err) { peer.close(); });
this.peer = peer;
return this;
},
setRemoteDescription: function (sdp) {
this.peer.setRemoteDescription(new SessionDescription(sdp));
},
addIceCandidate: function (candidate) {
this.peer.addIceCandidate(new IceCandidate({
sdpMLineIndex: candidate.sdpMLineIndex,
candidate: candidate.candidate
}));
}
};
var Answerer = {
createAnswer: function (offerSDP) {
var peer = new PeerConnection(iceServers);
peer.ondatachannel = function (event) {
answererDataChannel = event.channel;
setChannelEvents(answererDataChannel);
};
peer.onicecandidate = function (event) {
if (event.candidate) {
socket.emit("candidate", event.candidate);
}
};
peer.setRemoteDescription(new SessionDescription(offerSDP));
peer.createAnswer(function (sdp) {
peer.setLocalDescription(sdp);
socket.emit("sdp", sdp);
}, function (err) { peer.close(); });
this.peer = peer;
return this;
},
addIceCandidate: function (candidate) {
this.peer.addIceCandidate(new IceCandidate({
sdpMLineIndex: candidate.sdpMLineIndex,
candidate: candidate.candidate
}));
}
};
var peer = null;
socket.on("client is connected", function () {
peer = Offerer.createOffer();
socket.on("candidate", function (candidate) {
peer.addIceCandidate(candidate);
});
socket.on("sdp", function (sdp) {
peer.setRemoteDescription(sdp);
});
});
I have another file stream.html
that does a similar thing for the Answerer.
On the setChannelEvents
function there is the implementation of the channel onmessage.
This works perfectly on my LAN at home.
I have used the ngrok service for put this online for trying outside my local network, and is not working.
I'm using Google Chrome (updated to the last version, currently 35.0.1916.153).
Is there something that I'm missing? Is there a working example of WebRTC with TURN that I can try?
If needed, I can add the remaining code plus some output of the candidate
and sdp
.
note: the IP on the socket is modified when I start ngrok.