2013-06-12 14 views
8

Socket.ioは複数のメッセージを指数関数的に発生させているようですが、ここでは問題が発生している例を示します。複数のイベントを発生させるSocket.io

クライアント側:

<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> 

サーバー側:

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

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

何らかの理由でボタンがイベントをクリックするたびに指数関数的に増加し、複数回解雇。私はちょっとしたことが起こっていることを特定しようとしましたが、それをデバッグしたりオンラインで検索したりすることはありませんでした。

答えて

24

クリックハンドラが呼び出されるたびに、追加のイベントリスナがソケットに追加されます。以前のクリックでアタッチしたリスナーはアクティブのままです。古いリスナーを削除するには、removeListenerまたはremoveAllListenersを使用するか、リスナーコードをクリックハンドラの外に移動して、複数回呼び出されないようにする必要があります。例えば

$("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"); 
}); 
+0

ありがとうございました!私はsocket.ioがそれのようなコールバックを連結することに気づいていませんでした。 –

+1

@JosephShering、socket.io固有のものではありません。それはほとんどのイベントシステムがどのように機能するかです。私はそれがうまくいってうれしいです。あなたが私の答えに満足しているなら、それを合格とマークしてください。 –

関連する問題