node.js 带有 Socket.io 和 Node 的动态房间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6846174/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamic rooms with Socket.io and Node
提问by Rick
I'm trying to use the new "room" feature in Socket.io v.7 to create dynamic chat rooms, but I'm having problems getting static rooms to work in my example. Based on the URL the user selects they should end up in room1 or room2. Anything the user enters in the chat should be broadcast to users in the same room. I have 2 browsers (chrome & ff) each with a tab open to /room1 and /room2, however nothing I type in seems to be broadcast to the other tabs. What am I doing wrong?
我正在尝试使用 Socket.io v.7 中的新“聊天室”功能来创建动态聊天室，但是在我的示例中让静态聊天室无法正常工作时遇到了问题。根据用户选择的 URL，他们应该在 room1 或 room2 中结束。用户在聊天中输入的任何内容都应广播给同一房间的用户。我有 2 个浏览器（chrome 和 ff），每个浏览器都有一个打开到 /room1 和 /room2 的选项卡，但是我输入的任何内容似乎都没有广播到其他选项卡。我究竟做错了什么？
Server code
服务器代码
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);
Client code room 1
客户代码室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>
Client code 2
客户端代码 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>
回答by Cris-O
You don't seem to be listening to these events
你似乎没有在听这些事件
socket.broadcast.to(room).emit('new fan');
io.sockets.in(room).emit('new non-fan');
on the client side you need:
在客户端，您需要：
socket.on('new fan', function (data) {
console.log('new fan');
});
You're also not sending the message to the clients. Inside:
您也没有将消息发送给客户端。里面：
socket.on('message', function(data) { })
on the server, you need to do :
在服务器上，您需要执行以下操作：
io.sockets.in(room).emit('message', data);
