Socket.io: why socket.disconnect() on client side doesn't fire disconnect event on the server?

[sdrabb]

here's my code:

client-side

 var socket = io.connect('http://' + serverAddress ,{ reconnection: false, forceNew: true  }  );

 socket.emit('monitorAddedNotify' , { video: sourceVideo , socketId: socket.id});

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

server-side:

  io.on('connection', function (socket) {
    console.log('a user connected');


    socket.on('disconnect', function () {
        console.log('user disconnected');
    });
 });

the socket.disconnect() method doesn't work why?

[nkzawa]

As far as I tested, it works fine. How can we reproduce the issue?

[ventaquil]

Try to enter page and fast reload by pressing many times F5 button.

[alexandrubau]

It works fine for me also.

[ventaquil]

Which browser do you use? I'm using latest Firefox and when I fast reload bage "user disconnected" doesn't working :disappointed:

[iHaiduk]

I have the problem too. In these actions, disconnection, but it comes much later than was restarted browser.

Browser: Chrome 55.0.2883.95 (64-bit)
socket.io: "^1.7.2"

[giathinh910]

Hi @ventaquil. I'm the same trouble that the disconnect event not firing when holding F5. Have you got over this?

[darrachequesne]

@giathinh910 isn't the disconnect event fired after a given delay (that may be related to pingTimeout / pingInterval options, documented here)?

[giathinh910]

@darrachequesne My issue is the same as @ventaquil described above "Try to enter page and fast reload by pressing many times F5 button". Usually when you refresh a page socket connection will fire "disconnect" then "connect" again. I rely on these 2 events to update the numbers of online users. However if the page reloading fast enough, the "disconnect" won't fire, which cause some inexistent user socket id added. These unreal people will be removed after pingTimeout of course. Currently I change the way of saving socket id which will only show the online user, not the number of socket and the problem can be solved.

[invincibletrain]

I handled this problem this way. I've made an emit sender on client which is calling heartbeat on server.
socket.on("heartbeat", function() { // console.log('heartbeat called!'); hbeat[socket.id] = Date.now(); setTimeout(function() { var now = Date.now(); if (now - hbeat[socket.id] > 5000) { console.log('this socket id will be closed ' + socket.id); if (addedUser) { --onlineUsers; removeFromLobby(socket.id); try { // this is the most important part io.sockets.connected[socket.id].disconnect(); } catch (error) { console.log(error) } } } now = null; }, 6000); });

I found this code function to call:

io.sockets.connected[socket.id].disconnect();

[madprops]

This still happens. It doesn't have to be F5/refresh. Opening a tab and closing it soon quickly at a certain stage, causes disconnect to not be triggered. It's hard to reproduce because sockets are very fast, especially when running locally. I noticed opening the tab in the background and having other tabs open helped to reproduce the problem (locally). I think this is an important bug that should be addressed.

[ThatBrianDude]

Having the same issue here. This is creating ghost games on my game server

[GlitchBork]

Maybe to manually disconnect the client, you can use a function with some emitting.
I don't know if this'll help, but I think I got something... Maybe...

Client:

function ManualSocketDisconnect() {
    socket.emit("manual-disconnection", socket.id);

    socket.close();

    console.log("Socket Closed. ");
}

Server:

io.on("connection", function(socket) {
    console.log("User " + socket.id + " Connected. ");

    socket.on("manual-disconnection", function(data) {
        console.log("User Manually Disconnected. \n\tTheir ID: " + data);
    });
});

Sorry, but I probably left some holes in my code. I'm no professional. 🙁

[manjotsk]

I am facing the same issue!
I'll be giving the example in ReactJS-ExpressJS.

Here is the situation, which will fire the event, and is encapsulated in componentWillUnmount().

I'll be comparing two events, which i will fire from componentWillUnmount()

1. newMessage:- this will broadcast message to particular room
2. disconnect:-(I hoped it will work, but it doesn't) This event listener have call back which will disconnect. I have contained a console.log() just to confirm if the call back hits.

Now, Here we go:-
Client:-

These events are being fired:-

  componentDidMount() {
    console.log(this.props)
    chat.emit('authenticate', {
      token: localStorage.getItem('auth'),
      refreshToken: localStorage.getItem('refresh'),
      projectId: this.props.projectId,
      userId: this.props.userId,
    });
    chat.on('newMessage', (messageData) => {
      console.log('------------newMessageReceived-------------');
      this.props.messageReceived({ messages: this.props.messages, messageData }, () => {
        console.log('callback');
        this.setState({
          messages: this.props.messages
        })
      })
      console.log(messageData);
    })
  }

Following event wont fire.

  componentWillUnmount() {
    chat.emit('disconnect','just disconnect);
  }

The following event will be triggered.(just testing if normal message event emits)

  componentWillUnmount() {
    chat.emit('newMEssage', {
      messageHeader: {
        sender: {
          user: {
            id: this.props.userId,
            name: this.props.name
          }
        }
      },
      messageBody: 'hello',
    });
  }

No Luck

Server:-
Here is the code at the expressJS backend

//Following initializeChatSocket is called in app.js

function initializeChatSocket(server) {
  projects.hasMany(projectTeam, { foreignKey: 'projectId' });

  const io = socketIO(server);
  const chat = io.of('/chat').on('connection', function (socket) {
    console.log(
      '----------------------------------------New Chat Connection Established-------------------------------------------------------------------------'
    );

    socket.auth = false;

    socket.on('authenticate', function (data) {
      console.log('\n\n\n\n', 'authenticate called', '\n\n\n\n', data, '\n\n\n');

      try {
        const dummyReq = {
          headers: {
            refreshtoken: data.refreshToken,
          },
        };
        console.log('\n\n\n\n', 'before verify', '\n\n\n\n');
        const userDetails = verifyJWTToken(dummyReq, data.token);
        console.log('\n\n\n\n', 'after verify', '\n\n\n\n');
        socket.userId = userDetails.userId;
        socket.projectId = data.projectId;

        projectTeam
          .findAll({
            where: {
              [Op.and]: {
                projectId: data.projectId,
                userId: data.userId,
              }
            }
          })
          .then(projects => {
            console.log('\n\n\n\n', JSON.stringify(projects), '\n\n\n\n');
            if (projects.length === 1) {
              socket.auth = true;
              socket.join(socket.projectId);
              console.log('User id:- ${userDetails.userId} linked to project id :- ${socket.projectId}');
            } else {
              console.log('User id:- ${userDetails.userId} not linked to project id :- ${socket.projectId}');
              throw { message: 'User not linked to project' };
            }
          });
      } catch (error) {
        console.log(String(error));

        socket.auth = false;
        socket.disconnect(String(error));
      }
    });

    socket.on('disconnectt', function() {
      console.log('Client Disconnecting'); // This is not being fired :/
      socket.removeAllListeners('newMessage');
      socket.removeAllListeners('disconnect');
      socket.removeAllListeners('authenticate');
      socket.removeAllListeners('connection');
      });

    socket.on('newMessage', async function (messageData) {
      console.log('-------------------------New Message----------------------', String(messageData));
      //TODO Save Message in Database

      try {
        socket.broadcast.to(socket.projectId).emit('newMessage', messageData);
        console.log('\n\n\n\n\n broadcast sent\n\n' + JSON.stringify(messageData) + '\n\n\n');
      } catch (error) {
        console.log('\n\n\n\n\n broadcast error\n\n\n\n\n');
        console.log(String(error));

        console.log(error);
        //TODO Handle Message Sending Error
      }
    });

  });
}

Is this any issue with the browser or something else that i need to ask from stack-overflow community?

[nathanheffley]

@manjotsk I'm not sure if you've fixed it by now, but on your server side code you are listening for disconnectt(notice the double t) but your front-end is emitting disconnect. Also, you probably don't want to emit disconnect as that event is supposed to be sent from client to server when the client disconnects.

[kognise]

I have code that relies on the socket emitting the disconnect event to prevent duplicate ips-- users who reload my app quickly get blocked because the disconnect even never fires!

[manjotsk]

@manjotsk I'm not sure if you've fixed it by now, but on your server side code you are listening for disconnectt(notice the double t) but your front-end is emitting disconnect. Also, you probably don't want to emit disconnect as that event is supposed to be sent from client to server when the client disconnects.
disconnectt was an impostor alias that I was using! Thank you for pointing out. I'll recheck with this on both sides. And, obviously, the implementation was wrong! I got a clearer view! Thank you @nathanheffley 👍 :)

[kognise]

@manjotsk What?

[alvarojrio]

and only use socket.once instead socket.on
"customer level."
exemple:
socket.on('connect')
use
socket.once('connect'
.

[Xcode09]

same here my
socket.on("message") { (dataArray, socketAck) -> Void in

  if let data = dataArray.first as? Data{
    do{
      let objc = try JSONDecoder.init().decode(GetChatConversation.self, from: data)
      completionHandler(objc,nil)
    }
    catch let error{
      return completionHandler(nil,error.localizedDescription)
    }
  }else{
    completionHandler(nil,"Cannot cast Array of Any to Data")
  }
}

do not return the callback if anyone one knows tell me

[Ehsan666x]

are you dumb? you are waiting for an emit on client but no emit on server. fuck out of here

[GlitchBork]

That's some real negative energy, Ehsan666x.

[Hassuunna]

I handled this problem this way. I've made an emit sender on client which is calling heartbeat on server.
hbeat[socket.id] = Date.now();

I wonder what hbeat value should be sent from client-side?

[Nicekor]

Instead of socket.disconnect() or socket.emit('disconnect') try socket.close(); in the client side and it should trigger the 'disconnect' event on the server side. It worked for me.