Question

大家好。我正在使用NodeJS和SocketIO制作在线用户脚本。它工作正常但我的问题是，如果用户从多个浏览器/窗口/设备等连接，它会显示多个结果，如： 48 48 48 61所以我希望48只显示一次，如果他只退出一个浏览器而其他浏览器仍然连接，则保留它们。

这是我的代码：客户端：

socket.on('userslist',function(users){
    var text = "";
    var i;
      for (i = 0; i < users.length; i++) {
        text += users[i].user_name + "<br>";
        document.getElementById("demo").innerHTML = text;
      }
  });

服务器端：

socket.on('user name',function(user_name){
  users.push({id:socket.id,user_name:user_name});
  len=users.length;
  len--;
  //Sending th user Id and List of users
  io.emit('user entrance',users,users[len].id);
  io.emit('userslist',users);
});

我搜索但没有找到任何东西。

Answer 1

首先，对代码进行简单的优化：

socket.on('userslist',function(users){
    var text = "";
    var i;
    for (i = 0; i < users.length; i++) {
        text += users[i].user_name + "<br>";            
    }
    document.getElementById("demo").innerHTML = text; //<-- Only needs to happen once
  });

每个用户都不需要设置innerHTML，只需在所有文本连接完成后设置一次。

其次，保留一个单独的遍历用户数组以跟踪重复项：

socket.on('userslist',function(users){
    var usersProcessed = [];
    var text = "";
    for (var i = 0; i < users.length; i++) {
        if(usersProcessed.indexOf(users[i].user_name) < 0){
            text += users[i].user_name + "<br>";       
            usersProcessed.push(users[i].user_name);
        } 
    }
    document.getElementById("demo").innerHTML = text;
  });

这是客户端上的一个示例，但您可以在服务器上执行类似的操作，只需要知道是否需要知道是否存在重复项。如果没有，最好在服务器上进行，以最大限度地减少数据传输。

如果是，则检查搜索结果是否存在多次，而不是仅显示Javascript中的一个结果

1 个答案: