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

大家好。在这里解决了我的问题。我成功地在socket.io中的数组

users[]

中添加了

user

，并在客户端显示了连接的

users

用户断开连接后，将使用此代码删除用户的名称

delete users[socket.user]

但用户的名称仍保留在客户端中

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

这是我的server.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);
    }

});

这是我的client.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>

var socket=io.connect（'http://localhost:8080');
var userList=[]；
socket.on（'connect'，function（）{
emit（'adduser'，prompt（“你叫什么名字？”）；
});
socket.on（'update'，函数（用户）{
用户列表=用户；
$（'#user'）.empty（）；
对于（var i=0；i您不能按内容访问数组项。请编写一个函数，在
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(); 
});

无法按内容访问数组项。请编写一个函数，在
用户
数组中迭代以删除它

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(); 
});

客户端无法正确更新客户端的原因是您没有正确删除服务器端。您不能通过
delete
按数组键的内容删除数组键。请执行以下操作：

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

你所做的事情的问题是你在有效地做到这一点：

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

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

users[0] // undefined

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

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

客户端无法正确更新客户端的原因是您没有正确删除服务器端。您不能通过
delete
按数组键的内容删除数组键。请执行以下操作：

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

你所做的事情的问题是你在有效地做到这一点：

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

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

users[0] // undefined

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

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

感谢您的effor@Plato，但我的问题是，如果服务器上正在更新users对象（我对此表示怀疑，因为
用户[socket.user]
将是
未定义的
），则删除在client.html（interface）中断开连接的用户的名称那么您的更新代码应该可以正常工作。my或@Hexa氰化物的解决方案应该可以正确地从
用户中删除旧用户。谢谢@Plato我稍后还会尝试您的代码。谢谢您的努力，先生。：）谢谢您的effor@Plato，但我的问题是删除在client.html（interface）中断开连接的用户的名称.：）如果用户对象正在服务器上更新（我对此表示怀疑，因为
用户[socket.user]
将
未定义
）那么你的更新代码应该可以正常工作。无论是我的还是@hexa氰化物的解决方案都应该正确地从
用户中删除旧用户。谢谢@Plato，我稍后还会尝试你的代码。谢谢你的努力，先生。：）再次感谢你帮助我@hexa氰化物，我稍后将用你提供的代码更改我的代码。我如何删除用户的hexa氰化物如果他断开连接，客户端中会出现“氰化物”？另一个客户端也不会更新客户端中的用户。我将在客户端中添加什么来删除它们？再次感谢，先生。socket.io是否发送
更新
事件？客户端是否接收到事件？您的
socket.on（'update'））
客户端中的函数应该正确地重新绘制列表。添加
console.log（用户）
在该函数中查看客户端是否接收到更新的列表。更新事件正在运行。但这是我需要更新的。如果用户“六氰化物”断开连接怎么办。他的名字保持不变我在jquery中不是太好，我仍在学习。谢谢@plato您删除了错误的
div
。在客户端执行此操作：
$（'#users'）.empty（）；
然后
用于（var i=0；i'）；
。这是一个很好的解决方法。我个人的偏好是使用
p.user
而不是

：
$（'#users'）。append（$（
）。text（users[i]））
再次感谢@hexa氰化物帮助我，稍后我将使用您提供的代码更改我的代码。如果用户断开连接，我如何删除客户端中的用户“hexa氰化物”？另一个客户端也没有更新客户端中的用户。我将在客户端中放入什么来删除他们？再次感谢，先生。socket.io是否正在发送
更新de>event？客户端是否接收到事件？客户端中的
socket.on（'update'）
函数应正确地重新绘制列表。添加
console.log（用户）
在该函数中查看客户端是否接收到更新的列表。更新事件正在运行。但这是我需要更新的。如果用户“六氰化物”断开连接怎么办。他的名字保持不变我在jquery中不是太好，我仍在学习。谢谢@plato您删除了错误的
div
。在客户端执行此操作：
$（'#users'）.empty（）；
然后
用于（var i=0；i'）；
。这是一个很好的解决方法。我个人的偏好是使用
p.user
而不是

：
$（'#users'）。append（$（
）。text（users[i]））
另外，您确定可以执行
socket.user=user
并使
socket.user
对象在多个套接字消息中持久化吗？我对socketio不太熟悉，不知道这是否有效，但建议使用
s