Question

Question: How do you reconnect a client to the server after you have issued a manual .disconnect()?

In my current project, I need to disconnect a client from the server when the user log out from the session. I did a socket.disconnect() to do the disconnection successfully. Server removed the user from the session.

After awhile, the user decided to login again, but socket.io refuses to connect.

I am clear that Socket.IO has implemented reconnection algorithm but clearly this is a different case.

Below is the piece of code where I do the connection. On second trigger of this block of code, object socket was created, but no connect was fired from this object.

//Start the socket
var socket = io.connect(SOCKET_IO_URL);
socket.on('connect', function() {
    me.fireEvent('connect');
    socket.emit('register', {
        hashed_identifier: hashed_identifier,
        account_id: account_id
    });
});

socket.on('ready', function() {
    me.ready = true;
    me.log('Handshake done. Listening for new data');
});

socket.on('data', function(data) {
    me.fireEvent('data', data);
    //Tells server we received it
    socket.emit('data', {ack: 1});
});

socket.on('disconnect', function() {
    me.fireEvent('disconnect');
});

UPDATE: As requested by @Tony

In fact the whole thing is wrapped under Sencha Touch 2.0, but I believe there is nothing to do with ST2.0

This is my Data Class. Usage of this class is when the user logged in, this class will get initialized. And upon the user logout, the system will call the disconnect() method in this class.

When the user login again, this class is initialized again, but funny is the socket somehow retained all the previous events and sessions it has previously.

/**
* Serve as interface to wait for data communication in between server and client
*/
Ext.define('go.module.connect.Data', {

    mixins: {
        observable: 'Ext.mixin.Observable'
    },

    config: {
        account: null
    },

    ready: false,

    socket: null,

    constructor: function(cfg) {
        var me = this,
            hashed_identifier = Sha1.hash(go.__identifier);


        me.initConfig(cfg);

        var account_id = me.getAccount().get('id');

        //Start the socket
        var socket = io.connect(SOCKET_IO_URL);
        socket.on('connect', function() {
            console.log('connect');
            me.fireEvent('connect');
            socket.emit('register', {
                hashed_identifier:hashed_identifier,
                account_id: account_id
            });
        });

        socket.on('ready', function() {
            me.ready = true;
            me.log('Handshake done. Listening for new data');
        });

        socket.on('data', function(data) {
            me.fireEvent('data', data);
            //Tells server we received it
            socket.emit('data', {ack: 1});
        });

        socket.on('disconnect', function() {
            me.fireEvent('disconnect');
        });

        console.log(socket);
        if (!socket.socket.connected){
            socket.socket.reconnect();
        }


        me.socket = socket;


        me.callParent([cfg]);
    },

    disconnect: function() {
        this.socket.disconnect();
        this.socket.removeAllListeners();
        this.socket.socket.removeAllListeners();
    },

    log: function(msg) {
        console.log('@@ Connect: '+msg);
    }
});

And below is my console.log results:

And below is my node.js debug window

I believe the root cause of this funny scenario is that the previously attached connect event listener is not removed thoroughly. How should I remove it? Should I use once? or I should specify the listener function as well. I thought removeAllListeners() is sufficient for this task.

Answer 1

The standard approach in latest socket.io is:

socket.on('disconnect', function() {
    socket.socket.reconnect();
})

This is what I’ve been using in my app and works great. It also ensures that the socket keeps trying to reconnect if the server goes way, and eventually reconnects when the server is back online.

In your case, you need to ensure two things:

1. You create your socket only once. Don’t call socket = io.connect(...) more than once.
2. You setup your event handling only once – otherwise they will be fired multiple times!

So when you want to reconnect the client, call socket.socket.reconnect(). You can also test this from the browser console in FireFox and Chrome.