Develop Reference

CometD data not reaching client

I have two client applications that use CometD to talk to a server. My server sends some data to my clients using the deliver() method of the ServerSession. The data is in the form of a string.
One of my applications is a Javascript- based web application. I can access the data delivered by the server in the following manner:
function(theMsg) {
alert(theMsg.data);
}
This works well as a callback for when I want to send data on a particular channel.
Unfortunately, my second application is a Java application whose callback does not seem able to get the data. The callback works as follows:
public void onMessage(ClientSessionChannel channel, Message message)
{
String data = (String )theMsg.getData();
System.out.println("Data "+data);
}
The problem here is that the getData() for some reason returns a null in Java. I cannot seem to find any way to get at the data that I sent from the server!
Is there some kind of bug in the java CometD API, or am I using the wrong function to get the data that I am sending from the server? How can I get at this data?
Someone please advise...
Addition 1: below is the first client, implemented in Javascript, as requested by sbordet. This client works...
var cometD = $.cometd;
var isConnected = false;
var rcvHandshake = function(hndValue) {
console.log("Received handshake. Success flag is " + hndValue.successful);
}
var amConnected = function(msgConnect) {
if(cometD.isDisconnected())
{
isConnected = false;
console.log("Server connection not established!");
}
else
{
var prevconnected = mySelf.isConnected;
// This checks whether or not the connection was actually successful
isConnected = msgConnect.successful === true;
if((prevconnected == false) && (isConnected == true))
{
console.log("Connected to the server!");
cometD.addListener("/service/output",updateOutput);
}
else if((prevconnected == true) && (isConnected == false))
{
console.log("Connection to server has ended!")
}
}
}
var startUp = function() {
console.log("Starting up...");
var cometURL = $(location).attr('origin') + "/tester/cometd";
cometD.configure({
url: cometURL,
logLevel: 'info'
});
cometD.addListener('/meta/handshake',rcvHandshake);
cometD.addListener('/meta/connect',amConnected);
cometD.handshake({
"thehash.autohash": "foo-bar-baz-hash"
});
}
var updateOutput = function(theOut) {
alert(theOut.data);
}

I solved the problem.
I was looking over my Java code in order to format it for posting to this Question, when I noticed a typo in the channel names that I was listening for. I corrected the typo, which included a channel that I was using to publish requests to the server (apparently the listener I was using was activated before the data was returned), and as a result the getData() method was empty.
Sending the data to the correct channel solved the problem. My getData() method no longer returns null.
Sorry I bugged people about such a ridiculously amateurish mistake. I will try to avoid this sort of thing in future.
Special thanks to sbordet for requesting the full code, which caused me to re- examine it and find my typo...

WebRTC - 'RTCPeerConnection': The ICE candidate could not be added

The error I am getting in the browser console (only appears in chrome, no errors in firefox) is Error: Failed to execute 'addIceCandidate' on 'RTCPeerConnection': The ICE candidate could not be added.
I followed a tutorial and was able to get p2p video chat to work using nodejs. Now I am using Flask and python on the server side and angularjs on client side.
Signaling process for two peers is being done with angular-socketio.
console.log("The user connected to the socket");
socket.emit('readyToJoinRoom', {"signal_room": SIGNAL_ROOM});
//Send a first signaling message to anyone listening
//This normally would be on a button click
socket.emit('signal',{"type":"user_joined", "message":"Are you ready for a call?", "room":SIGNAL_ROOM});
socket.forward('signaling_message', $scope);
$scope.$on('socket:signaling_message', function (ev, data) {
displaySignalMessage("Signal received: " + data.type);
// Setup the RTC Peer Connection object
if (!rtcPeerConn) {
startSignaling();
}
if(data.type != "user_joined") {
console.log(data.message);
var message = JSON.parse(data.message);
console.log(message);
if(message.sdp) {
console.log("inside 2nd if statement");
rtcPeerConn.setRemoteDescription(new RTCSessionDescription(message.sdp), function () {
// if we received an offer, we need to answer
if(rtcPeerConn.remoteDescription.type === 'offer') {
console.log("inside third if for remoteDescription."); // This never executes, error happens right before this line
rtcPeerConn.createAnswer(sendLocalDesc, logError);
}
}, logError);
}
else {
console.log("addedddddddd ice candidate.");
rtcPeerConn.addIceCandidate(new RTCIceCandidate(message.candidate));
}
}
});
Once two people join the room the startSignaling() method is called. It sets the local description and completes 3 ice candidates then I receive an SDP but this is never true if(rtcPeerConn.remoteDescription.type === 'offer') even though it prints the SDP in the console with a type equal to offer. I am not sure why it never goes inside this if statement. I am not sure why I am getting an error. If you have any questions just ask. Thanks for the help.

I think
rtcPeerConn.setRemoteDescription(new RTCSessionDescription(message.sdp),...
will not work because the constructor of RTCSessionDescription needs the information about the type and the sdp. Try:
var desc = new RTCSessionDescription();
desc.sdp = message.sdp;
desc.type = "offer";
rtcPeerConn.setRemoteDescription(desc,.....
I had some issues constructing the RTCSessionDescription from JSON as well.
Hope this helps...

Wrong Error Code in Angular.js $resource responce

I have a function that lists the databases attached to a SQL server by making an API call.
function dbList(resource, args, scope, server){
// Recieves a list of DBs from the API and adds it to the scope
scope.loadingResponse = true;
resource('http://localhost:1000/apiv1/servers/:server/databases',
{server: server}).get(args).$promise.then(function (result) {
scope.databases = result.databases;
scope.loadingResponse = false;
}, function(error){
console.log(JSON.stringify(error));
errorHandler(scope, error)
})
}
It is called from my controller like:
dbList($resource, args, $scope, 'SERVER1');
It passes any errors it encounters to my error handler, which evaluates them:
function errorHandler(scope, error){
// Displays the error message and ends the loading animation
var err_code = error.status;
var err_message = 'Error Code ' + error.status + ': ';
console.log(JSON.stringify(error))
if (err_code == 401){
err_message += 'Unauthorized. Cookie expired or nonexistent.';
}
else if (err_code == 400) {
err_message += 'Missing parameter. Ensure all necessary fields are filled'
}
else if (err_code == 404) {
err_message += 'Resource not found. Ensure that it exists.'
}
else if (err_code == 405) {
err_message += 'Method not allowed. This could be caused by XHR Cross Domain Option requests.'
}
else if (err_code == 409) {
err_message += 'The Resource you wish to use is in use. Ensure that there is no name conflict with an attached database.'
}
scope.loadingResponse = false;
scope.error = err_message;
}
I'm making a call to the API without submitting the token I have to verify with, and am getting a 401 Error according to the Firefox console. This is the expected behavior when the API is access without the token. So I expected $scope.error to be set to Error Code 401: Unauthorized. Cookie expired or nonexistent.
However, what I am getting is Error Code 404: Resource not found. Ensure that it exists.
The Firefox console reads:
[13:39:20.419] GET http://localhost:1000/apiv1/servers? [HTTP/1.0 401 UNAUTHORIZED 5ms]
[13:39:20.413] "{"data":"","status":404,"config":{"transformRequest":[null],"transformResponse":[null],"method":"GET","url":"http://localhost:1000/apiv1/servers","params":{},"headers":{}}}"
How and why has angular.js transformed my 401 into a 404, and how can I access the correct status code?
ETA:
The problem turned out to be a cross-domain request issue caused by the Flask API I was using to run things from. See my answer below

The answer turns out to be a problem with the back end, which was done in Flask. A decorator was used to correctly set up Access-Control-Allow-Origin headers. Unfortunately, the decorator doesn't apply to errors that are done using the abort() function. The way around this is to use this decorator, and set things up like this:
if verify(req):
do stuff ...
else:
return jsonify({'error': 401}), 401
If the error is set up as a json return with an error code, the decorator will reach it.

node.js - should socket.get work on client?

I'm new to node.js and I'm making a simple chat app to get started. I'm a bit confused with the socket.set and socket.get methods.
The way the app works, is - first the client sets its username (pseudo):
function setPseudo() {
if ($("#pseudoInput").val() != "")
{
socket.emit('setPseudo', $("#pseudoInput").val());
$('#chatControls').show();
$('#pseudoInput').hide();
$('#pseudoSet').hide();
}
}
On the server, the pseudo is fetched with:
socket.on('setPseudo', function (data) {
socket.set('pseudo', data);
});
If I understand correctly, the server sets the pseudo variable with data received from this particular client. The server can later get that variable with socket.get. The following code broadcasts a message from a client to all clients:
socket.on('message', function (message) {
socket.get('pseudo', function (error, name) {
var data = { 'message' : message, pseudo : name };
socket.broadcast.emit('message', data);
console.log("user " + name + " send this : " + message);
})
});
What I don't understand is, why can't the client itself use socket.get to fetch its own pseudo? Using socket.get('pseudo') gives an error saying socket.get is not a function. Or am I overcomplicating this, and it would be better to just store the pseudo in a hidden field on the client or something similar? It just feels strange that a client should have to get its own username from the server.
EDIT:
Upon clicking Send, this code displays the sent message on the client itself. However, the displayed username is "Me". How can I modify it to show the client's username from the server?
addMessage($('#messageInput').val(), "Me", new Date().toISOString(), true);
function addMessage(msg, pseudo) {
$("#chatEntries").append('<div class="message"><p>' + pseudo + ' : ' + msg + '</p></div>');
}

You have to realize that although socket is a name used by both the server and the client, and interfaces are similar these are two independent things. (i.e. server socket and client socket) describing two ends of one connection.
If server sets some data on a socket what it actually does is it saves some data in its own memory and remembers that this data is associated with the socket. So how would client read something from server's memory? How can machine A read data from machine's B memory? Well, the only (reasonable) possibility is to send that data over network and this is actually what happens.
As for the other question: it's actually natural for the client to get its own name from the server or at least validate that name. Consider this scenario: two clients connect to the server and use the same name. This would lead to a conflict so it is up to the server to solve the problem. Basically you would tell one of the clients "sorry, this name is already being used, use something else".

How to create data channel in WebRTC peer connection?

I'm trying to learn how to create an RTCPeerConnection so that I can use the DataChannel API. Here's what I have tried from what I understood:
var client = new mozRTCPeerConnection;
var server = new mozRTCPeerConnection;
client.createOffer(function (description) {
client.setLocalDescription(description);
server.setRemoteDescription(description);
server.createAnswer(function (description) {
server.setLocalDescription(description);
client.setRemoteDescription(description);
var clientChannel = client.createDataChannel("chat");
var serverChannel = server.createDataChannel("chat");
clientChannel.onmessage = serverChannel.onmessage = onmessage;
clientChannel.send("Hello Server!");
serverChannel.send("Hello Client!");
function onmessage(event) {
alert(event.data);
}
});
});
I'm not sure what's going wrong, but I'm assuming that the connection is never established because no messages are being displayed.
Where do I learn more about this? I've already read the Getting Started with WebRTC - HTML5 Rocks tutorial.

I finally got it to work after sifting through a lot of articles: http://jsfiddle.net/LcQzV/
First we create the peer connections:
var media = {};
media.fake = media.audio = true;
var client = new mozRTCPeerConnection;
var server = new mozRTCPeerConnection;
When the client connects to the server it must open a data channel:
client.onconnection = function () {
var channel = client.createDataChannel("chat", {});
channel.onmessage = function (event) {
alert("Server: " + event.data);
};
channel.onopen = function () {
channel.send("Hello Server!");
};
};
When the client creates a data channel the server may respond:
server.ondatachannel = function (channel) {
channel.onmessage = function (event) {
alert("Client: " + event.data);
};
channel.onopen = function () {
channel.send("Hello Client!");
};
};
We need to add a fake audio stream to the client and the server to establish a connection:
navigator.mozGetUserMedia(media, callback, errback);
function callback(fakeAudio) {
server.addStream(fakeAudio);
client.addStream(fakeAudio);
client.createOffer(offer);
}
function errback(error) {
alert(error);
}
The client creates an offer:
function offer(description) {
client.setLocalDescription(description, function () {
server.setRemoteDescription(description, function () {
server.createAnswer(answer);
});
});
}
The server accepts the offer and establishes a connection:
function answer(description) {
server.setLocalDescription(description, function () {
client.setRemoteDescription(description, function () {
var port1 = Date.now();
var port2 = port1 + 1;
client.connectDataConnection(port1, port2);
server.connectDataConnection(port2, port1);
});
});
}
Phew. That took a while to understand.

I've posted a gist that shows setting up a data connection, compatible with both Chrome and Firefox.
The main difference is that where in FF you have to wait until the connection is set up, in Chrome it's just the opposite: it seems you need to create the data connection before any offers are sent back/forth:
var pc1 = new RTCPeerConnection(cfg, con);
if (!pc1.connectDataConnection) setupDC1(); // Chrome...Firefox defers per other answer
The other difference is that Chrome passes an event object to .ondatachannel whereas FF passes just a raw channel:
pc2.ondatachannel = function (e) {
var datachannel = e.channel || e;
Note that you currently need Chrome Nightly started with --enable-data-channels for it to work as well.

Here is a sequence of events I have working today (Feb 2014) in Chrome. This is for a simplified case where peer 1 will stream video to peer 2.
Set up some way for the peers to exchange messages. (The variance in how people accomplish this is what makes different WebRTC code samples so incommensurable, sadly. But mentally, and in your code organization, try to separate this logic out from the rest.)
On each side, set up message handlers for the important signalling messages. You can set them up and leave them up. There are 3 core messages to handle & send:
an ice candidate sent from the other side ==> call addIceCandidate with it
an offer message ==> SetRemoteDescription with it, then make an answer & send it
an answer message ===> SetRemoteDescription with it
On each side, create a new peerconnection object and attach event handlers to it for important events: onicecandidate, onremovestream, onaddstream, etc.
ice candidate ===> send it to other side
stream added ===> attach it to a video element so you can see it
When both peers are present and all the handlers are in place, peer 1 gets a trigger message of some kind to start video capture (using the getUserMedia call)
Once getUserMedia succeeds, we have a stream. Call addStream on the peer 1's peer connection object.
Then -- and only then -- peer 1 makes an offer
Due to the handlers we set up in step 2, peer 2 gets this and sends an answer
Concurrently with this (and somewhat obscurely), the peer connection object starts producing ice candidates. They get sent back and forth between the two peers and handled (steps 2 & 3 above)
Streaming starts by itself, opaquely, as a result of 2 conditions:
offer/answer exchange
ice candidates received, exchanged, and added
I haven't found a way to add video after step 9. When I want to change something, I go back to step 3.