如何在客户端加入时使用socket.io放置更多元素？

Question

当第二个客户端加入/连接服务器时，我愿意在第一个元素旁边创建一个新的div元素：

app.js

...
io.on('connection', function(client){
    console.log("Client connected...");
    client.emit('add_player');
});
...

index.ejs

...
server.on('add_player', function () {
        $(document).ready(function () {
            $('.field').append(player);
            });
        });
    });
...

我在每个浏览器上只获得一个元素。这就是我得到的：

这就是我想要实现的目标。但是怎么样？

Answer 1

我认为这是因为您只在当前连接到服务器的客户端上发出该功能。然后，当您获得新连接时，您再次向该客户端发出一个功能，而不是对旧连接感到困扰，您也不会查看已完成的连接数量，并且在当前客户端上发送了多次该功能。相反，你只发射一次。

所以你需要的是你必须维护一组客户端并在每个连接上将新客户端推送到数组中。

var clientArray = new Array();

并且在连接侦听器上需要进行以下修改

io.on('connection', function(client){
console.log("Client connected...");
for(i=0;i<clientArray.length;i++)
    clientArray[i].emit('add_player');     //emitting the function once to all ohter clients because a new client has been added

clientArray.push(client);                  // pushing the new client to the array
for(i=0;i<clientArray.length;i++)
    client.emit('add_player');            // emitting the function on the new client exactly equal to the number of client presently in the array
});