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

时间:2013-10-09 16:24:32

标签: javascript node.js sockets socket.io

大家好。在SO解决我的问题。我在socket.io中的数组user中成功添加了users[],并在客户端显示了连接的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>

我不知道要放在socket.on('disconnect', function() {});中的内容,以便在客户端删除断开连接的用户和用户名。

2 个答案:

答案 0 :(得分:3)

客户端未正确更新客户端的原因是因为您没有正确删除服务器端。您无法通过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);

答案 1 :(得分: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(); 
});
相关问题