带有Socket.io和Node的dynamic客房
我试图在Socket.io v.7中使用新的“房间”function来创builddynamic聊天室，但是在我的示例中，我遇到了让静态房间工作的问题。 根据用户select的URL，他们应该在room1或room2结束。 用户在聊天中input的任何内容都应该广播给同一个房间的用户。 我有2个浏览器（chrome＆ff），每个都有一个打开/ room1和/ room2的标签，但是我input的内容似乎没有被广播到其他标签。 我究竟做错了什么？
服务器代码
var app = require('express').createServer(); var io = require("socket.io").listen(app); io.sockets.on('connection', function (socket) { // join to room and save the room name socket.on('join room', function (room) { socket.set('room', room, function() { console.log('room ' + room + ' saved'); } ); socket.join(room); }) socket.on('message', function(data) { console.log("Client data: " + data); // lookup room and broadcast to that room socket.get('room', function(err, room) { //room example - https://github.com/learnboost/socket.io // neither method works for me socket.broadcast.to(room).emit('new fan'); io.sockets.in(room).emit('new non-fan'); }) }) }); app.get('/room1', function(req, res){ res.render('example2-client.ejs', {layout:false}); }); app.get('/room2', function(req, res){ res.render('example2-client-2.ejs', {layout:false}); }); app.listen(4000); 客户代码室1
<!DOCTYPE HTML> <html><head> <title>Code review for Snipet</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" src="http://localhost:4000/socket.io/socket.io.js"></script> <script> $(document).ready(function() { var socket = io.connect('http://localhost:4000'); $("#msgbox").keypress( function(event) { if (event.which == '13') { sendmsg(); event.preventDefault(); } }); socket.on('connect', function (data) { socket.emit('join room', 'room1' ); }); socket.on('message', function (data) { add_message(data); }); function add_message(m) { $("#chatlog").append(m); $("#chatlog").append("<BR>"); } function sendmsg() { var r = $("#msgbox").val(); socket.emit('message', r ); add_message(r); $("#msgbox").val(''); } }); </script> </head> <body> <div id="chat" style="height: 200px; width: 200px; border: 1px solid grey;"> <div id="chatlog" style="height: 178px; width: 200px; overflow-y: scroll;"></div> <input type="text" id="msgbox" style="margin-left: 2px; width: 193px;"> </div> </body> </html>
客户端代码2
<!DOCTYPE HTML> <html><head> <title>Code review for Snipet</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" src="http://localhost:4000/socket.io/socket.io.js"></script> <script> $(document).ready(function() { var socket = io.connect('http://localhost:4000'); $("#msgbox").keypress( function(event) { if (event.which == '13') { sendmsg(); event.preventDefault(); } }); socket.on('connect', function (data) { socket.emit('join room', 'room2' ); }); socket.on('message', function (data) { add_message(data); }); function add_message(m) { $("#chatlog").append(m); $("#chatlog").append("<BR>"); } function sendmsg() { var r = $("#msgbox").val(); socket.emit('message', r ); add_message(r); $("#msgbox").val(''); } }); </script> </head> <body> <div id="chat" style="height: 200px; width: 200px; border: 1px solid grey;"> <div id="chatlog" style="height: 178px; width: 200px; overflow-y: scroll;"></div> <input type="text" id="msgbox" style="margin-left: 2px; width: 193px;"> </div> </body> </html>
你似乎没有听到这些事件
socket.broadcast.to(room).emit('new fan'); io.sockets.in(room).emit('new non-fan');
在客户端你需要：
socket.on('new fan', function (data) { console.log('new fan'); });
你也没有发送消息给客户。 内：
socket.on('message', function(data) { })
在服务器上，您需要执行以下操作：
io.sockets.in(room).emit('message', data);