NodeJS & Socket.IO: Emit a request event and get the response, when/where should I bind the listener?

Question

I'm currently wondering about what could be the best programming practice in this case:

Let's say I've got client connected to my server. And this client is asking the server for authentication with an auth event and his username.

socket = io();
socket.emit('auth', "John");

In this simple case, server is responding with an auth_succeed event with the users's id.

io.on('connection', function(socket) {
    socket.on('auth', function(username) {
        socket.emit('auth_succeed', id);
    }
}

So my question is, when or where should I bind the listener for the auth_succeed event in the client ? There's two ways for me :

Before emitting, which ensures, I guess, that the response event will always be properly handled, but leads to some spaghetti code. Ex:

socket = io();
socket.on('auth_succeed', function(id){
    //Do some post-auth stuff here
}); 
socket.emit('auth', "John");

Or after emitting, which leads to cleaner code, but could possibly, I guess again, miss the event if sended quick enough. Ex:

socket = io();
socket.emit('auth', "John");
socket.on('auth_succeed', function(id){
    //Do some post-auth stuff here
}); 

What's your thoughts about that problem ?

Answer 1

Since the response from the emit should be asynchronous, and the client-side JS is synchronous in nature, the socket.on('auth_succeed' binding will happen before the callback from the auth event.

---

The following flow will happen on the client...

// EXECUTION SCOPE BEGINS
...
// this will send a message to the server
// the message and/or response will be sent asynchronously
socket.emit('auth', 'John'); 
// so your code will continue before you get anything from the server

//which means the following binding will happen before any response to the above emit
socket.on('auth_succeed', function(id){
  //... handle message from server ...
});
...
// EXECUTION SCOPE ENDS

Sometime after the enclosing scope/function is done executing the event of 'auth_succeed' be raised.

---

You may also want to consider breaking out your event handlers...

socket.on('auth_succeed', onAuthSucceed.bind(null, socket));
socket.emit('auth', 'john');

// ... elsewhere ...

function onAuthSucceed(socket, id) {
  // handle message from server
}

This will reduce the noise with your binding, and your signal event, regardless of if you choose to bind or emit first.

By having the function require anything it needs, and using binding for the event, the method in question can be in a separate file/module, and more easily tested in isolation.