Js节点 – socket.io聊天修改

这是一个简单的聊天示例。 我如何修改脚本以便：

在前5s内，第一个用户可以发送消息，在接下来的5s中，用户在接下来的5s内不能发送消息（当第一个用户不能发送消息时），第二个用户可以发送消息，第一个用户得到一个div（apIdv1）来显示index.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'); // 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(); } }); }); </script> <style type="text/css"> #apDiv1 { position:absolute; width:200px; height:115px; z-index:1; left: 150px; top: 20px; background-color: #FF9900; display:none; } </style> <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> </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> <div id="apDiv1"></div> 

app.js

 var app = require('express').createServer() var io = require('socket.io').listen(app); app.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'); }); // 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){ // leave the current room (stored in session) socket.leave(socket.room); // join new room, received as function parameter 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); }); }); 

我怎样才能向一个用户显示前5秒的apDiv1，然后使其消失，反之亦然？

更新与答案：

为什么这现在不工作？

app.js

 var app = require('express').createServer() var io = require('socket.io').listen(app); app.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'); }); // 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){ // leave the current room (stored in session) socket.leave(socket.room); // join new room, received as function parameter 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); }); function redLightGreenLight() { socket1.emit('redLight'); socket2.emit('greenLight'); } setTimer('redLightGreenLight()', 5000); // 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); }); }); 

的index.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'); // 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); } *socket.on('greenLight', function (data) { // change div to enable sending a message }); socket.on('redLight', function (data) { // change div to index.html* }); // 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(); } }); }); </script> <style type="text/css"> #greenLight { position:absolute; width:200px; height:115px; z-index:1; left: 150px; top: 20px; background-color: #FF9900; display:none; } </style> <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> </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> ***<div id="greenLight"></div>*** 

Answer 1

Quoth beginerplus，“也许是更好的服务器做的工作…如何改变我的脚本做到这一点？请作为例子回答”：

在服务器上：

 function redLightGreenLight() { socket1.emit('redLight'); socket2.emit('greenLight'); } setTimer('redLightGreenLight()', 5000); 

在客户端：

 socket.on('greenLight', function (data) { // change div to enable sending a message }); socket.on('redLight', function (data) { // change div to index.html }); 

Answer 2

有两种方法：

1. 服务器在5秒后向每个客户端发送消息，使用setTimer（或setInterval以防万一需要重复）：客户端＃1不能再发送消息，而客户端＃2可以。 然后每个客户端通过更改div内容来处理消息。
2. 每个客户端自己使用setTimer或setInterval; 这可能会有一些优点取决于您的使用情况，但可能有一个缺点，定时器不会在同一时间启动。