断开连接时更新客户端中的用户列表

Updating user list in client upon disconnection

本文关键字：用户 列表 客户端 连接 更新 断开      更新时间：2023-09-26

大家好。在SO中解决我的问题后。我在 socket.io 的数组users[]中成功添加了user，并在客户端显示了连接的users。

用户断开连接后，将使用此代码删除用户名delete users[socket.user];但用户名仍保留在客户端中。

你能帮我删除用户的名字吗？谢谢。

这是我的服务器.js

var redis = require('redis');
var express = require('express');
var app = express();
var http = require('http');
var server = http.createServer(app);
var io = require('socket.io').listen(server);
server.listen(8080);
var users = [];
app.get('/', function (req, res) {
res.sendfile(__dirname + '/test.html');
    });
io.sockets.on('connection', function (socket) {
    socket.on('adduser', function (user) {
        socket.user = user;
        users.push(user);
        updateClients();
    });
    socket.on('disconnect', function () {
        delete users[socket.user];
        updateClients(); 
    });
    function updateClients() {
        io.sockets.emit('update', users);
    }
});

这是我的客户.html。 

<script src="/socket.io/socket.io.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
    var socket = io.connect('http://localhost:8080');
    var userList = [];
    socket.on('connect', function (){
        socket.emit('adduser', prompt("What's your name?"));
    });

    socket.on('update', function (users){
        userList = users;
        $('#user').empty();
        for(var i=0; i<userList.length; i++) {
            $('#user').append("<b>" + userList[i] + "</b></br>"); 
        }
    });
</script>
<div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;">
    <b>Users</b>
    <div id="users">
        <p id="user"></p>
    </div>
</div>

我不知道在socket.on('disconnect', function() {});中放入什么，因此断开连接的用户和用户名将在客户端中删除。

客户端未

正确更新客户端的原因是您没有删除正确的服务器端。不能使用 delete 删除数组键的内容。相反，请执行此操作：

socket.on('disconnect', function() {
  users.splice(users.indexOf(socket.user), 1);
  updateClients(); 
});
你

正在做的事情的问题在于你实际上是在这样做：

var users = [];
users.push('foo');
delete users['foo'];

由于arr是一个数组，users['foo']将映射到未定义。字符串foo实际上是数组的索引之一，因此您必须使用 delete users[0] ，这将导致数组键仍然存在但未定义：

users[0] // undefined

相反，您应该完全删除密钥：

var index = users.indexOf(socket.user);
users.splice(index, 1);

无法按内容访问数组项。编写一个函数以遍历users数组以将其删除。

function removeUser(username){
  var users2 = [];
  users.forEach(function(user){
    if(user === username){ return;} // do nothing this iteration
    users2.push(user); // if we haven't returned yet, add to users2
  });
  users = users2;
  return users2;
};
socket.on('disconnect', function() {
  removeUser(socket.user);
  updateClients(); 
});
相关文章：