Socket.io fires several events

Socket.io seems to be exposing a few messages, here is an example that I run that causes the problem.

Client side:

<html> <head> <script type="text/javascript" src="../../js/jquery191.min.js"></script> <script type="text/javascript" src="http://192.168.1.2:8887/socket.io/socket.io.js"></script> </head> <body> <button>Click Me!</button> <script type="text/javascript"> $(document).ready(function(){ var socket = io.connect('http://192.168.1.2:8887'); $("button").click(function(){ console.log("Emitting test_parent"); socket.emit('test_parent'); socket.on('test_parent_server', function(data){ console.log("Handling test_parent_server"); console.log("Emitting test_child"); socket.emit('test_child'); socket.on('test_child_server', function(ing){ console.log("Handling test_child_server"); }); }); }); }); </script> </body> </html> 

Server side:

 socket.on("test_parent", function(){ socket.emit("test_parent_server", { data : " " }); }); socket.on("test_child", function(){ socket.emit("test_child_server", { data : " " }); }); 

For some reason, every time a button is pressed, events fire several times, increasing exponentially. I tried to determine what was going on, but I could not debug it or do an Internet search.

+8
websocket
source share
1 answer

Each time the click handler is called, it attaches additional event listeners to the socket. Listeners attached to previous clicks remain active. You need to either start using removeListener or removeAllListeners to remove the old listeners, or you need to move the listener code outside the click handler so that it is not called multiple times.

For example:

 $("button").click(function() { console.log("Emitting test_parent"); socket.emit('test_parent'); }); socket.on('test_parent_server', function(data) { console.log("Handling test_parent_server"); console.log("Emitting test_child"); socket.emit('test_child'); }); socket.on('test_child_server', function(ing) { console.log("Handling test_child_server"); }); 
+24
source share

All Articles