Multiple sockets open after reconnect
Problem
I've noticed this both on my socket.io application and someone else's. When a reconnect occurs, it's common for more than one socket within a client to be open, which should never happen. Here's a log I got from my own test application when I had a disconnect/reconnect. *\ Disconnect *\ Reconnecting with delay 1000 Attempts: 1 *\ Reconnecting with delay 2000 Attempts: 2 *\ Connecting with xhr-polling *\ Connecting with xhr-polling *\ Reconnect with transport type xhr-polling Attempts: 2 *\ Connected *\ Connected When this happens, I get duplicate messages sent, one for each connected socket, even though there should only be one. It is confirmed by Firebug that there are, in fact, two sockets from the client connected. My best guess is that this is in the client code, perhaps not closing the first reconnection attempt. Of course, the real question might be why was there a disconnect in the first place?
Unverified for your environment
Select your OS to check compatibility.
1 Fix
Ensure Single Socket Connection on Reconnect
The issue arises because the client does not properly handle the closure of the existing socket connection before initiating a new connection upon reconnect attempts. This leads to multiple sockets being open simultaneously, causing duplicate messages and resource leaks.
Awaiting Verification
Be the first to verify this fix
- 1
Implement Socket Cleanup on Disconnect
Before attempting to reconnect, ensure that the existing socket connection is closed. This can be done by listening for the 'disconnect' event and explicitly calling the 'close' method on the socket instance.
javascriptsocket.on('disconnect', () => { socket.close(); }); - 2
Avoid Multiple Connection Attempts
Implement a flag to track whether a connection attempt is already in progress. This prevents multiple reconnection attempts from being initiated simultaneously.
javascriptlet isConnecting = false; socket.on('disconnect', () => { if (!isConnecting) { isConnecting = true; socket.connect(); } }); - 3
Handle Connection Events Properly
Ensure that on successful connection, the flag is reset, allowing for future reconnections. Listen for the 'connect' event to reset the connection state.
javascriptsocket.on('connect', () => { isConnecting = false; }); - 4
Implement a Reconnection Strategy
Use socket.io's built-in reconnection options to manage reconnection attempts and delays, which can help avoid rapid reconnections that may lead to multiple sockets being opened.
javascriptconst socket = io({ reconnectionAttempts: 5, reconnectionDelay: 1000 }); - 5
Test and Monitor Socket Connections
After implementing the above changes, monitor the application for any remaining issues with multiple socket connections. Use debugging tools to confirm that only one socket is active at any time.
javascriptsetInterval(() => { console.log('Active sockets:', io.engine.clientsCount); }, 5000);
Validation
Confirm that after implementing these changes, the application no longer opens multiple socket connections upon reconnect. Test by simulating disconnects and checking the console logs for active socket counts. Ensure that only one socket is connected at any time.
Sign in to verify this fix
Environment
Submitted by
Alex Chen
2450 rep