Some of the stesp I have taken include
modifying nginx setup
map $http_upgrade $connection_upgrade {
default upgrade;
'' close;
}
server {
server_name services.parleyvale.com;
...
location /s2gio/ {
proxy_pass http://127.0.0.1:3222;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_cache_bypass $http_upgrade;
}...
but network tab gave me 404's so on my client (react) app added
modifying client
//var socket = io.connect(cfg.urls.socket)
var socket = io.connect(cfg.urls.socket,{
secure: true,
rejectUnauthorized: false,
path: '/s2gio/socket.io'
});
slightly better but the server was not responding so on the server added
modifying server
//const io = require('socket.io')(server)
const io = require('socket.io')(server,
{
secure: true,
rejectUnauthorized: false,
path: '/s2gio/socket.io'
});
io.of('/s2gio')
now the messages from client show up on server but they do not 'emit' from the server.
comparing the ssl nginx debug file
2020-03-12T19:12:36.309Z socket.io:socket emitting event ["message",{"lid":"Jutebi","product":"Avacado","done":1,"jsod":"","loc":"produce"}]
2020-03-12T19:12:36.309Z socket.io:socket dispatching an event ["message",{"lid":"Jutebi","product":"Avacado","done":1,"jsod":"","loc":"produce"}]
that's all I get before they both go back to writing 2's and 3's. But localhost does encodes, encoding, writing and sending
2020-03-12T19:12:36.309Z socket.io:socket emitting event ["message",{"lid":"Jutebi","product":"Avacado","done":1,"jsod":"","loc":"produce"}]
2020-03-12T19:12:36.309Z socket.io:socket dispatching an event ["message",{"lid":"Jutebi","product":"Avacado","done":1,"jsod":"","loc":"produce"}]
message: { lid: 'Jutebi',
product: 'Red potatoes',
done: 0,
jsod: '',
loc: 'dairy' }
socket.io-parser encoding packet {"type":2,"data":["message",{"lid":"Jutebi","product":"Red potatoes","done":0,"jsod":"","loc":"dairy"}],"nsp":"/"} +16ms
socket.io-parser encoded {"type":2,"data":["message",{"lid":"Jutebi","product":"Red potatoes","done":0,"jsod":"","loc":"dairy"}],"nsp":"/"} as 2["message",{"lid":"Jutebi","product":"Red potatoes","done":0,"jsod":"","loc":"dairy"}] +0ms
socket.io:client writing packet ["2[\"message\",{\"lid\":\"Jutebi\",\"product\":\"Red potatoes\",\"done\":0,\"jsod\":\"\",\"loc\":\"dairy\"}]"] +15m
engine:socket sending packet "message" (2["message",{"lid":"Jutebi","product":"Red potatoes","done":0,"jsod":"","loc":"dairy"}]) +17ms
engine:ws writing "42["message",{"lid":"Jutebi","product":"Red potatoes","done":0,"jsod":"","loc":"dairy"}]" +19ms
qry.sql: INSERT INTO items SET `lid` = 'Jutebi', `product` = 'Red potatoes', `done` = 0, `jsod` = '', `loc` = 'dairy' ON DUPLICATE KEY UPDATE `lid` = 'Jutebi', `product` = 'Red potatoes', `done` = 0, `jsod` = '', `loc` = 'dairy'
the server is pretty simple
const io = require('socket.io')(server);
io.on('connect', (socket) => {
io.emit('message', 'connected io')
socket.on('switch2room', (room)=>{
console.log('swwwwww')
console.log('switch2room: ', room)
socket.leaveAll()
socket.join(room, ()=>{
console.log('subscribe ', socket.rooms);
io.in(room).emit('message', `inside ${room} party people?`)
})
})
socket.on('message', (message)=>{
console.log('message: ', message)
io.in('/s2gio/'+message.lid).emit('message',message)
if(message.done==-1){
const qry=conn.query('DELETE FROM items WHERE lid=? AND product=?',[message.lid,message.product],()=>{
console.log('qry.sql: ', qry.sql)
})
}else{
const qry = conn.query('INSERT INTO items SET ? ON DUPLICATE KEY UPDATE ?', [message,message], (error,results)=>{
console.log('qry.sql: ', qry.sql)
})
}
})
});
server.listen(cfg.port.socket);
console.log('wss listening on '+cfg.port.socket);
I also tried adding 'namespace' in emit on the server
io.on('connect', (socket) => {
io.emit('message', '/s2gio/connected io')
...
Any ideas would be greatly appreciated
Related
Trying to use socketcluster to exchange events between browser windows.
On the sender side I have :
var options = {
hostname: "myserver.com",
secure: true,
port: 443,
connectTimeout: 86400000,
autoReconnectOptions: {
initialDelay: 100, //milliseconds
randomness: 10, //milliseconds
multiplier: 1.5, //decimal
maxDelay: 60000 //milliseconds
}
};
// Initiate the connection to the server
var socket = socketCluster.connect(options);
socket.on('connect', function () {
console.log('CONNECTED');
});
function sendTime() {
var currentDate = new Date();
var theId = document.getElementById("object_id").value;
count++;
console.log("id "+theId);
socket.emit('identity1', { timestamp: currentDate, id: theId, counter:count});
}
Then on the server I have the worker publish a new event :
socket.on('identity1', function (data) {
count++;
console.log('Handled identity1', data);
scServer.exchange.publish('identity-' + data.id, data);
});
And on the receiver side I have :
// Initiate the connection to the server
var socket = socketCluster.connect(options);
socket.on('connect', function () {
console.log('CONNECTED');
identityChannel = socket.subscribe('identity-' + document.getElementById("object_id").value);
identityChannel.watch(function (data) {
var theTime=data.timestamp;
console.log('ID:' + data.id + ' TIME: ' + theTime);
document.getElementById("data2").innerHTML = 'TIME: ' + theTime + 'COUNTER : ' + data.counter ;
});
});
In the js console of Chrome I see that after 10s on both sides, the client connection is refused like that :
socketcluster.js:678 Uncaught SocketProtocolError {name: "SocketProtocolError", message: "Socket hung up", code: 1006, stack: "SocketProtocolError: Socket hung up↵ at SCSocke…myserver.com/socketcluster.js:1392:10)"}
(anonymous) # socketcluster.js:678
setTimeout (async)
SCSocket._onSCError # socketcluster.js:676
SCSocket._onSCClose # socketcluster.js:781
(anonymous) # socketcluster.js:426
Emitter.emit # socketcluster.js:4152
SCTransport._onClose # socketcluster.js:1494
wsSocket.onclose # socketcluster.js:1392
sender.html:26 CONNECTED
I see that when reconnecting some events are lost.
Q : is this normal ?
Q : can the 10s limit be tuned ?
Actually you have to set the GCP load balancer connection timeout other than the default value of 10s.
I have signaling server in java and websocket.
It works well with local video. but Remote video is black screen or blank
But it is not always a blank. If you turn off the server and turn it on again, the remote video will show up on your remote.
Why does not it always come out sometimes, and sometimes it does not come out?
this is my code...
navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
window.RTCIceCandidate = window.RTCIceCandidate || window.mozRTCIceCandidate || window.webkitRTCIceCandidate;
window.RTCSessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription;
window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition || window.mozSpeechRecognition
|| window.msSpeechRecognition || window.oSpeechRecognition;
var localVideoStream = null;
var peerConn = null,
wsc = new WebSocket("ws://localhost:8080/signaling"),
peerConnCfg = {
'iceServers': [{
'url': 'stun:stun.l.google.com:19302'
}]
};
var videoCallButton = document.getElementById("caller");
var endCallButton = document.getElementById("callee");
var localVideo = document.getElementById('localVideo');
var remoteVideo = document.getElementById('remoteVideo');
videoCallButton.addEventListener("click", initiateCall);
endCallButton.addEventListener("click", function (evt) {
wsc.send(JSON.stringify({"closeConnection": true }));
});
var sdpConstraints = {
'mandatory': {
'OfferToReceiveAudio': true,
'OfferToReceiveVideo': true
}
};
function prepareCall() {
peerConn = new RTCPeerConnection(peerConnCfg);
// send any ice candidates to the other peer
peerConn.onicecandidate = onIceCandidateHandler;
// once remote stream arrives, show it in the remote video element
peerConn.onaddstream = onAddStreamHandler;
};
// run start(true) to initiate a call
function initiateCall() {
prepareCall();
// get the local stream, show it in the local video element and send it
navigator.getUserMedia({ "audio": true, "video": true }, function (stream) {
localVideoStream = stream;
localVideo.src = URL.createObjectURL(localVideoStream);
peerConn.addStream(localVideoStream);
createAndSendOffer();
}, function(error) { console.log(error);});
};
function answerCall() {
prepareCall();
// get the local stream, show it in the local video element and send it
navigator.getUserMedia({ "audio": true, "video": true }, function (stream) {
localVideoStream = stream;
localVideo.src = URL.createObjectURL(localVideoStream);
peerConn.addStream(localVideoStream);
createAndSendAnswer();
}, function(error) { console.log(error);});
};
wsc.onmessage = function (evt) {
var signal = null;
if (!peerConn) answerCall();
signal = JSON.parse(evt.data);
if (signal.sdp) {
console.log("Received SDP from remote peer.");
console.log("signal"+ signal);
peerConn.setRemoteDescription(new RTCSessionDescription(signal.sdp));
}
else if (signal.candidate) {
console.log("signal"+ signal.candidate);
console.log("Received ICECandidate from remote peer.");
peerConn.addIceCandidate(new RTCIceCandidate(signal.candidate));
} else if ( signal.closeConnection){
console.log("Received 'close call' signal from remote peer.");
endCall();
}else{
console.log("signal"+ signal.candidate);
}
};
function createAndSendOffer() {
peerConn.createOffer(
function (offer) {
var off = new RTCSessionDescription(offer);
peerConn.setLocalDescription(new RTCSessionDescription(off),
function() {
wsc.send(JSON.stringify({"sdp": off }));
},
function(error) { console.log(error);}
);
},
function (error) { console.log(error);}
);
};
function createAndSendAnswer() {
peerConn.createAnswer(
function (answer) {
var ans = new RTCSessionDescription(answer);
peerConn.setLocalDescription(ans, function() {
wsc.send(JSON.stringify({"sdp": ans }));
},
function (error) { console.log(error);}
);
},
function (error) {console.log(error);}
);
};
function onIceCandidateHandler(evt) {
if (!evt || !evt.candidate) return;
wsc.send(JSON.stringify({"candidate": evt.candidate }));
};
function onAddStreamHandler(evt) {
videoCallButton.setAttribute("disabled", true);
endCallButton.removeAttribute("disabled");
// set remote video stream as source for remote video HTML5 element
remoteVideo.src = window.URL.createObjectURL(evt.stream);
remoteVideo.play();
console.log("remote src : "+ remoteVideo.src);
};
function endCall() {
peerConn.close();
peerConn = null;
videoCallButton.removeAttribute("disabled");
endCallButton.setAttribute("disabled", true);
if (localVideoStream) {
localVideoStream.getTracks().forEach(function (track) {
track.stop();
});
localVideo.src = "";
}
if (remoteVideo){
remoteVideo.src = "";
window.URL.revokeObjectURL(remoteVideo);
}
};
One of the reasons for WebRTC blank / empty video is having high packet loss. In that scenario, in server and client logs it will show as the connection is successful and video is playing normally, so you won't see any warning or error.
To check if there is a high packet loss, you can go to about:webrtc on firefox, or chrome://webrtc-internals on chrome. For firefox, you can navigate to "RTP Stats". You'll see it shows Received: ... packets and Lost: ... packets. You can calculate packet loss ratio using these counts. For chrome, there is a graph for packet loss ratio. You might have a very high packet loss such as 70% for example.
If you have this extreme high packet loss, one reason is having a smaller MTU https://en.wikipedia.org/wiki/Maximum_transmission_unit on the client network interface than the MTU used by the server. For example, your client network interface can have MTU=1500 bytes when not connected to VPN, and MTU=1250 bytes when connected to VPN. If the server is sending RTP packets (over UDP) with MTU=1400, it can be received by the client if the client is not using VPN, but the packets larger than 1250 bytes will get dropped by the client network interface.
If you want to check the client MTU locally, you can run ifconfig on mac or linux.
Mac example, without example vpn:
en0: flags=8863<UP,BROADCAST,SMART,RUNNING,SIMPLEX,MULTICAST> mtu 1500
...
inet SOME_IP netmask 0xffffff00 broadcast 192.168.1.255
media: autoselect
status: active
Mac example, with example vpn:
utun2: flags=80d1<UP,POINTOPOINT,RUNNING,NOARP,MULTICAST> mtu 1250
inet SOME_IP --> SOME_IP netmask 0xffffffff
nd6 options=201<PERFORMNUD,DAD>
How to configure MTU for server:
If you are using GStreamer for WebRTC server, the payload generator element, for example rtpvp8pay has a property to set desired MTU value.
By using gst-inspect-1.0 rtpvp8pay you can see that it uses 1400 as MTU by default which can be larger than your client network interface can handle (e.g. 1250 on above example).
You can make it work by setting lower MTU on your GStreamer pipeline so that your client network interface won't drop majority of the packages anymore (package loss ratio can reduce to 0.01% just by changing MTU on GStreamer pipeline on the server).
When this is the case, the incoming video can work for ~10 seconds when VPN is freshly reconnected, then the incoming video can freeze and subsequent page refreshes can lead to just blank video with 70%+ packet loss.
This is a very specific scenario but when it happens it is a complete silent/hidden error so hopefully this helps someone.
add oniceconnectionstatechange to your prepeareCall Function and see if there is any ICE failure because of NAT issues
function prepareCall() {
peerConn = new RTCPeerConnection(peerConnCfg);
// send any ice candidates to the other peer
peerConn.onicecandidate = onIceCandidateHandler;
// once remote stream arrives, show it in the remote video element
peerConn.onaddstream = onAddStreamHandler;
peerConn.oniceconnectionstatechange = function(){
console.log('ICE state: ',peerConn.iceConnectionState);
}
};
in func did recieve remote video track perform a timer then in timer selector add track to view
I am trying to implement share screen function in webrtc video conferencing. From suggestion, I am now following muaz-khan's solution using https://www.webrtc-experiment.com/getScreenId/ . I can easily capture the application images of one peer, and replace the video stream with the capture stream. But it is a video conferencing experiment, so two browsers need to video conference with each other. For example, browser 1, has video streams A (local video), video streams B (remote video); browser 2 has video streams B (local video), video streams A (remote video). So when I am in browser 1 and trying to share the screen, the share screen stream should replace the local video in browser 1, and remote video in browser 2.
But right now, I can only make the share screen replace the local video in browser 1, browser 2 doesn't have any changes, cann't see any changes in its remote video (which is the local video in browser 1). I don't know how to trigger the changes in browser 2 as well. do i need to signal the share screen streams to server? and change the remote stream accordingly?
Here is my code in javascript:
$(function() {
var brokerController, ws, webRTC, localid;
// ws = new XSockets.WebSocket("wss://rtcplaygrouund.azurewebsites.net:443", ["connectionbroker"], {
ws = new XSockets.WebSocket("ws://localhost:4502", ["connectionbroker"], {
ctx: "152300ed-4d84-4e72-bc99-965052dc1e95"
});
var addRemoteVideo = function(peerId,mediaStream) {
var remoteVideo = document.createElement("video");
remoteVideo.setAttribute("autoplay", "true");
remoteVideo.setAttribute("rel",peerId);
attachMediaStream(remoteVideo, mediaStream);
remoteVideo.setAttribute("class", "col-md-3");
remoteVideo.setAttribute("height", $( document ).height() * 0.3);
remoteVideo.setAttribute("id", 'remoteVideo');
$("#videoscreen").append(remoteVideo);
};
var onConnectionLost = function (remotePeer) {
console.log("onconnectionlost");
var peerId = remotePeer.PeerId;
var videoToRemove = $("video[rel='" + peerId + "']");
videoToRemove.remove();
};
var oncConnectionCreated = function() {
console.log("oncconnectioncreated", arguments);
}
var onGetUerMedia = function(stream) {
console.log("Successfully got some userMedia , hopefully a goat will appear..");
webRTC.connectToContext(); // connect to the current context?
};
var onRemoteStream = function (remotePeer) {
addRemoteVideo(remotePeer.PeerId, remotePeer.stream);
console.log("Opps, we got a remote stream. lets see if its a goat..");
};
var onLocalStream = function(mediaStream) {
console.log("Got a localStream", mediaStream.id);
localid = mediaStream.id;
console.log("check this id: meadiastram id ", mediaStream.id);
var video = document.createElement("video");
video.setAttribute("height", "100%");
video.setAttribute("autoplay", "true");
video.setAttribute("id", "localvideo");
video.setAttribute("name", mediaStream.id);
attachMediaStream(video, mediaStream);
$("#videoscreen").append(video);
$('#share').click(function() {
getScreenId(function (error, sourceId, screen_constraints) {
navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia(screen_constraints, function (stream) {
$('#localvideo').attr('src', URL.createObjectURL(stream));
}, function (error) {
console.error(error);
});
});
});
};
var onContextCreated = function(ctx) {
console.log("RTC object created, and a context is created - ", ctx);
webRTC.getUserMedia(webRTC.userMediaConstraints.hd(true), onGetUerMedia, onError);
};
var onOpen = function() {
console.log("Connected to the brokerController - 'connectionBroker'");
webRTC = new XSockets.WebRTC(this);
webRTC.onlocalstream = onLocalStream;
webRTC.oncontextcreated = onContextCreated;
webRTC.onconnectioncreated = oncConnectionCreated;
webRTC.onconnectionlost = onConnectionLost;
webRTC.onremotestream = onRemoteStream;
};
var onConnected = function() {
console.log("connection to the 'broker' server is established");
console.log("Try get the broker controller form server..");
brokerController = ws.controller("connectionbroker");
brokerController.onopen = onOpen;
};
ws.onconnected = onConnected;
});
I am using xsocket as the server, and the codes for click share and change the local stream with the share screen streams are just very simple as this:
$('#share').click(function() {
getScreenId(function (error, sourceId, screen_constraints) {
navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia(screen_constraints, function (stream) {
$('#localvideo').attr('src', URL.createObjectURL(stream));
}, function (error) {
console.error(error);
});
});
Any help or suggestion would be grateful.
Thanks for pointing out the other post: How to addTrack in MediaStream in WebRTC, but I don't think they are the same. And also I am not sure how to renegotiate the remote connection in this case.
Xsocket.webrtc.js file for webrtc connection:
https://github.com/XSockets/XSockets.WebRTC/blob/master/src/js/XSockets.WebRTC.latest.js
How I could I renegotiate the remote connection in this case?
I figured out a work around solution by myself for this question, do not replace the local stream with the sharescreen stream, instead remove the old local stream from local div, then add the new sharescreen stream to local div. In the meantime, send the old local stream id by datachanel to the other peer, and remove that old remote video as well.
The most important thing is reflesh the streams (renegotiation), then sharescreen stream would display in remote peer.
Code:
$('#share').click(function() {
getScreenId(function (error, sourceId, screen_constraints) {
navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia(screen_constraints, function (stream) {
webRTC.removeStream(webRTC.getLocalStreams()[0]);
var id = $('#localvideo').attr('name');
$('#localvideo').remove();
brokerController.invoke('updateremotevideo', id);
webRTC.addLocalStream(stream);
webRTC.getRemotePeers().forEach(function (p) {
webRTC.refreshStreams(p);
});
}, function (error) {
console.error(error);
});
});
});
after get the command to remove that old video stream from the server:
brokerController.on('updateremotevideo', function(streamid){
$(document.getElementById(streamid)).remove();
});
This solution works for me. Although if only like to replace the local video stream with share screen stream, we need to re create the offer with sdp, and send sdp to remote peer. It is more complicated.
getScreenId(function (error, sourceId, screen_constraints) {
navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia(screen_constraints, function (stream) {
navigator.getUserMedia({audio: true}, function (audioStream) {
stream.addTrack(audioStream.getAudioTracks()[0]);
var mediaRecorder = new MediaStreamRecorder(stream);
mediaRecorder.mimeType = 'video/mp4'
mediaRecorder.stream = stream;
self.setState({recorder: mediaRecorder, startRecord: true, shareVideo: true, pauseRecord: false, resumeRecord: false, stopRecord: false, downloadRecord: false, updateRecord: false});
document.querySelector('video').src = URL.createObjectURL(stream);
var video = document.getElementById('screen-video')
if (video) {
video.src = URL.createObjectURL(stream);
video.width = 360;
video.height = 300;
}
}, function (error) {
alert(error);
});
}, function (error) {
alert(error);
});
});
I am using worklight 6.1 and facing some issue for getting x-forwarded ip address at adapter level which we want while request. So right now i am sending client ip address from client side on adapter like this given below
WL.Device.getNetworkInfo(function (networkInfo) {
console.log(networkInfo.ipAddress);
ipadd = networkInfo.ipAddress;
reqParams["fldAppipAddress"] = networkInfo.ipAddress;
});
var invocationData = {
adapter : "Login",
procedure : "Login",
parameters : [id,reqParams,ipadd],
compressResponse : true
};
and adapter side I am setting header like this
var request={
method:'POST',
returnedContentType:'xml',
path:serverPathIs,
headers:{"User-Agent":"","App-Version":"1.6","X-Forwarded-For":Ipaddress},
cookies: {"JSESSIONID":cookiestr},
parameters:jsonstr,
};
Even after doing this i am not getting x-forwarded ip , please suggest the proper way.
How to set x-forwarded-for in header of http request.
# Anton
function GetAPICal(fldjsessionid,jsonstr,pass,uid,Ipaddress){
WL.Logger.error(jsonstr);
WL.Logger.info(jsonstr);
//newjson={"fldPassword":enc(pass)};
var output = {};
output = jsonConcat(jsonstr, newjson);
serverPathIs=getServletPathInfo();
if(fldjsessionid){
cookieSplit = fldjsessionid.split('!');
cookiestr = cookieSplit[0]+"!"+cookieSplit[1];
}
else{
cookiestr="123";
}
var request={
method:'POST',
returnedContentType:'xml',
path:serverPathIs,
headers:{"User-Agent":"","App-Version":"1.6","X-Forwarded-For":Ipaddress},
cookies: {"JSESSIONID":cookiestr},
parameters:output,
};
var req = WL.Server.getClientRequest();
var response = WL.Server.invokeHttp(request);
return response;
}
What exactly are you trying to achieve? Take x-forwarded-for header from client->adapter request and use it in adapter->backend request?
I have been trying to establish peer connection between browsers, to use data channel, but i am unsuccessful.
Everytime I correct one statement another error appears.
First I established a socketting server using socket.io and Node.js. In the server when any client is connection I am sending 'beacon' packets. On listening 'beacon' packet 1st client requests to join a 'room'. Then I allow the second client to join the same 'room'.
As soon as the second client connects, Server sends a confirmation packet to Client 1.
Then Client 1 sends the RTC Peer Connection 'offer' to Client 2, after setting local Description.
if( isChrome ) {
localPC = new window.webkitRTCPeerConnection(server, contraints);
rslt.innerHTML = "Webkit Variables Set";
}else {
localPC = new mozRTCPeerConnection(server, contraints);
rslt.innerHTML = "Mozilla Variables Set";
}
localPC.onicecandidate = function(event) {
if( event.candidate )
localPC.addIceCandidate( event.candidate );
};
localPC.onnegotiationneeded = function() {
localPC.createOffer( setOffer, sendFail );
};
sendChannel = localPC.createDataChannel( "sendDataChannel", {reliable: false} );
localPC.ondatachannel = function(event) {
receiveChannel = event.channel;
receiveChannel.onmessage = function(event) {
rslt.innerHTML = event.data;
};
};
localPC.createOffer( setOffer, sendFail );
function setOffer( offer ) {
lDescp = new RTCSessionDescription(offer);
localPC.setLocalDescription( lDescp );
socket.emit( 'offer', JSON.stringify(offer) );
rslt.innerHTML += "Offer Sent...<br/>";//+offer.sdp;
}//End Of setOffer()
Client 2 on receiving the 'offer' sets its as remote Description and creates a 'reply'. Sets the 'reply' as local Description, and sends it.
if( message.type == 'offer' ) {
rDescp = new RTCSessionDescription(message.sdp);
localPC.setRemoteDescription( rDescp );
localPC.createAnswer(
function( answer ) {
lDescp = new RTCSessionDescription(answer);
localPC.setLocalDescription( lDescp );
socket.emit( 'reply', JSON.stringify(answer) );
}, sendFail
);
}else {
localPC.addIceCandidate = new RTCIceCandidate( message.candidate );
}//End Of IF ELse
Client 1 on receiving the 'reply' sets it as remote Description and the connection should get established???
localPC.setRemoteDescription( new RTCSessionDescription( message.sdp ) );
But its not working!!! Pleease Help.
Seems like you got the flow correct, although I don't see the entire code.
One thing that strikes me weird is this:
localPC.onicecandidate = function(event) {
if( event.candidate )
localPC.addIceCandidate( event.candidate );
};
You need to send the icecandidate recieved in the onicecandidate event to the other peer. and not add it yourself.