Menu
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?
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
<!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
<!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> 
209
socket.io rooms are a lightweight data structure. They are simply an array of connections that are associated with that room. You can have as many as you want (within normal memory usage limits). There is no heavyweight thing that makes a room expensive in terms of resources.
js and Socket.IO. Within each namespace, you can also define arbitrary channels that sockets can join and leave. These channels are called rooms. Rooms are used to further-separate concerns.
Joining and leaving In that case, a union is performed: every socket that is at least in one of the rooms will get the event once (even if the socket is in two or more rooms). In that case, every socket in the room excluding the sender will get the event. To leave a channel you call leave in the same fashion as join .
Socket.IO is a library that enables real-time, bidirectional and event-based communication between the browser and the server. It consists of: a Node.
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); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
