爲什麼我的socket.io事件不能在多個瀏覽器上處理？

所以我寫一個小的「共同瀏覽」的演示。主要用於教育目的。爲什麼我的socket.io事件不能在多個瀏覽器上處理？

無論如何，計劃是這樣的。用戶打開瀏覽器到我的服務器並移動鼠標。這樣做時，瀏覽器將鼠標座標發送到服務器，服務器將座標中繼到訂閱該通道的任何瀏覽器。座標然後顯示在文本框中。

我使用nodejs和socket.io。

這裏是我的server.js：

var app = require('http').createServer(handler), 
    io = require('socket.io').listen(app), 
    fs = require('fs'); 


app.listen(80); 

function handler(req, res) { 
    var file = __dirname + '/public/index.html'; 
    fs.readFile(file, 
     function(err, data) { 
      if(err) { 
       res.writeHead(500); 
       return res.end('Error loading index.html'); 
      } 

      res.writeHead(200); 
      res.end(data); 
     } 
    ); 
} 


io.sockets.on('connection', function(socket) { 
    socket.on('m', function(data) { 
     socket.emit('relay', {msg: 'MouseX: ' + data.x + ' MouseY: ' + data.y}); 
    }); 
});

這裏是我的客戶：

<!doctype html> 
<html> 
    <head> 
    </head> 
    <body> 

     <input id='box' type='text' size='200' /> 

     <script src='/socket.io/lib/socket.io.js'></script> 
     <script> 

      var socket = io.connect('http://localhost'); 
      var b = document.getElementById('box'); 

      socket.on('relay', function(data) { 
       b.setAttribute('value', data.msg); 
      }); 

      document.onmousemove = function(event) { 
       event = event || window.event; 
       socket.emit('m', {x: event.clientX, y: event.clientY}); 
      } 


     </script> 

    </body> 
</html>

現在，如果我打開兩個瀏覽器，並指出兩到本地主機，我可以在一個窗口中移動鼠標並在頂部的文本框工作。它顯示座標。但是，其他瀏覽器不會執行任何操作。但是，如果我將鼠標移到其他瀏覽器上，它會在其窗口上顯示座標。這就像它只是繼承我目前徘徊的瀏覽器。服務器控制檯顯示兩個瀏覽器上的移動。

但由於兩個瀏覽器窗口都響應relay事件（頻道），不應該這兩種瀏覽器呼應的座標？因此，瀏覽器1的鼠標移動被回顯到瀏覽器2，當我瀏覽器瀏覽器2時，它的座標被回顯到瀏覽器1？

希望是有道理的。

感謝

** **解決方案

感謝維克多Stanciu的快速答覆。這是我爲修復服務器所做的。

var app = require('http').createServer(handler), 
    io = require('socket.io').listen(app), 
    fs = require('fs'); 


app.listen(80); 

function handler(req, res) { 
    var file = __dirname + '/public/index.html'; 
    fs.readFile(file, 
     function(err, data) { 
      if(err) { 
       res.writeHead(500); 
       return res.end('Error loading index.html'); 
      } 

      res.writeHead(200); 
      res.end(data); 
     } 
    ); 
} 

var sockets = []; 
io.sockets.on('connection', function(socket) { 
    sockets.push(socket); 

    socket.on('m', function(data) { 
     io.sockets.emit('relay', {msg: 'MouseX: ' + data.x + ' MouseY: ' + data.y}); 
    }); 
});

來源

2012-10-17 cbmeeks

那是因爲你只emmiting到您從接收信號插座：

io.sockets.on('connection', function(socket) { 
    socket.on('m', function(data) { 
     socket.emit('relay', {msg: 'MouseX: ' + data.x + ' MouseY: ' + data.y}); 
    }); 
});

這是說：「如果從‘插座’接收的‘M’的信號，發出了「中繼'信號「。

你需要做的是什麼 - 當一個新的socket連接，將其添加到陣列 - 當套接字發出一個信號，遍歷所有連接的插座，併發出了「中繼」信號發送到每個他們

var sockets = []; 
io.sockets.on('connection', function(socket) { 
    sockets.push(socket); 

    socket.on('m', function(data) { 
     sockets.forEach(function (socket) { 
      socket.emit('relay', {msg: 'MouseX: ' + data.x + ' MouseY: ' + data.y}); 
     }); 
    }); 
});

或者，而通過連接插口，手動迭代，socket.io提供了一種方法來做到這一點：

io.sockets.emit('this', { will: 'be received by everyone'});

來源

2012-10-17 13:28:32

哇！感謝你及時的答覆。你超過了時間限制。大聲笑。直到3分鐘後，我才能給你答案。呵呵。無論如何，我用完成的解決方案更新了我的問題。謝謝！ – cbmeeks

爲什麼我的socket.io事件不能在多個瀏覽器上處理？

回答

相關問題