Node.js /套接字聊天 – 用户列表

我一直在关注如何制作一个多房间简单聊天应用程序的教程和github( https://github.com/mmukhin/psitsmike_example_2 )。 我对此很新。

我试图修改它列出房间列表右侧的用户名。 但它不工作,它似乎没有抛出任何错误,但?

我做了以下几件事:

的index.html

我已将以下代码添加到原始代码中:

<div id="roomusers"></div> 

  socket.on('updateroomusers', function(roomusers) { $("#roomusers").empty(); $.each(roomusers, function (key, value) { $('#roomusers').append(''+value+”); }); }); 

这是原来的

  <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'); // on connection to server, ask for user's name with an anonymous callback socket.on('connect', function(){ // call the server-side function 'adduser' and send one parameter (value of prompt) socket.emit('adduser', prompt("What's your name?")); }); // listener, whenever the server emits 'updatechat', this updates the chat body socket.on('updatechat', function (username, data) { $('#conversation').append('<b>'+username + '> </b> ' + data + '<br>'); }); // listener, whenever the server emits 'updaterooms', this updates the room the client is in socket.on('updaterooms', function(rooms, current_room) { $('#rooms').empty(); $.each(rooms, function(key, value) { if(value == current_room){ $('#rooms').append('<div>' + value + '</div>'); } else { $('#rooms').append('<div><a href="#" onclick="switchRoom(\''+value+'\')">' + value + '</a></div>'); } }); }); function switchRoom(room){ socket.emit('switchRoom', room); } // on load of page $(function(){ // when the client clicks SEND $('#datasend').click( function() { var message = $('#data').val(); $('#data').val(''); // tell server to execute 'sendchat' and send along one parameter socket.emit('sendchat', message); }); // when the client hits ENTER on their keyboard $('#data').keypress(function(e) { if(e.which == 13) { $(this).blur(); $('#datasend').focus().click(); } }); }); socket.on('updateroomusers', function(roomusers) { $("#roomusers").empty(); $.each(roomusers, function (key, value) { $('#roomusers').append(''+value+”); }); }); </script> <div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;"> <b>ROOMS</b> <div id="rooms"></div> <b>USERS</b> <div id="roomusers"></div> </div> <div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;"> <div id="conversation"></div> <input id="data" style="width:200px;" /> <input type="button" id="datasend" value="send" /> </div> 

和app.js(评论之间的一切

///////// ****用户列表开始*********** ///////

///////// ****用户列表结束*********** ///////是我添加的代码

 var express = require('express') , app = express() , http = require('http') , server = http.createServer(app) , io = require('socket.io').listen(server); server.listen(8080); // routing app.get('/', function (req, res) { res.sendfile(__dirname + '/index.html'); }); // usernames which are currently connected to the chat var usernames = {}; // rooms which are currently available in chat var rooms = ['room1','room2','room3']; io.sockets.on('connection', function (socket) { // when the client emits 'adduser', this listens and executes socket.on('adduser', function(username){ // store the username in the socket session for this client socket.username = username; // store the room name in the socket session for this client socket.room = 'room1'; // add the client's username to the global list usernames[username] = username; // send client to room 1 socket.join('room1'); // echo to client they've connected socket.emit('updatechat', 'SERVER', 'you have connected to room1'); // echo to room 1 that a person has connected to their room socket.broadcast.to('room1').emit('updatechat', 'SERVER', username + ' has connected to this room'); socket.emit('updaterooms', rooms, 'room1'); /////////**** Userlist Start ***********/////// // get all the clients in 'room1′ var clients = io.sockets.clients('room1'); // loop through clients in 'room1′ and add their usernames to the roomusers array for(var i = 0; i < clients.length; i++) { roomusers[roomusers.length] = clients[i].username; /////////**** Userlist End ***********/////// } // broadcast to everyone in room 1 the usernames of the clients connected. io.sockets.to('room1').emit('updateroomusers',roomusers); }); // when the client emits 'sendchat', this listens and executes socket.on('sendchat', function (data) { // we tell the client to execute 'updatechat' with 2 parameters io.sockets.in(socket.room).emit('updatechat', socket.username, data); }); socket.on('switchRoom', function(newroom){ socket.leave(socket.room); socket.join(newroom); socket.emit('updatechat', 'SERVER', 'you have connected to '+ newroom); // sent message to OLD room socket.broadcast.to(socket.room).emit('updatechat', 'SERVER', socket.username+' has left this room'); // update socket session room title socket.room = newroom; socket.broadcast.to(newroom).emit('updatechat', 'SERVER', socket.username+' has joined this room'); socket.emit('updaterooms', rooms, newroom); }); // when the user disconnects.. perform this socket.on('disconnect', function(){ // remove the username from global usernames list delete usernames[socket.username]; // update list of users in chat, client-side io.sockets.emit('updateusers', usernames); // echo globally that this client has left socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected'); socket.leave(socket.room); }); });