本文原文地址：https://www.limitcode.com/detail/5922f1ccb1d4fe074099d9cd.html
前言
上篇我们介绍了 socket.io 基本使用方法，本篇我们继续深入了解 socket.io 中 room（房间）的概念和使用。
对于 room 的概念，你只需理解3个地方就可以：
1. 在不加入或指定room的情况下，socket.io 会默认分配一个default room
2. 同一room下的socket可以广播消息
3. join(房间名) 加入一个房间；leave(房间名) 离开一个房间；broadcast.to(房间名).emit() 给同一个房间的其他socket广播消息
源码下载地址：http://pan.baidu.com/s/1eSaf1Pg
项目文件结构
服务端
/** * Created by mike on 2017/5/15. */ var http=require("http"); var express=require("express");//引入express var socketIo=require("socket.io");//引入socket.io var app=new express(); var server=http.createServer(app); var io=new socketIo(server);//将socket.io注入express模块 //客户端 1 的访问地址 app.get("/client1",function (req,res,next) { res.sendFile(__dirname+"/views/client1.html"); }); app.get("/client2",function (req,res,next) { res.sendFile(__dirname+"/views/client2.html"); }); server.listen(8080);//express 监听 8080 端口，因为本机80端口已被暂用 console.log("服务已启动"); //每个客户端socket连接时都会触发 connection 事件 io.on("connection",function (clientSocket) { // socket.io 使用 emit(eventname,data) 发送消息，使用on(eventname,callback)监听消息 //加入房间 clientSocket.on("joinRoom",function (data,fn) { clientSocket.join(data.roomName); // join(房间名)加入房间 fn({"code":0,"msg":"加入房间成功","roomName":data.roomName}); }); //退出 离开房间 clientSocket.on("leaveRoom",function (data,fn) { clientSocket.leave(data.roomName);//leave(房间名) 离开房间 fn({"code":0,"msg":"已退出房间","roomName":data.roomName}); }); //监听客户端发送的 sendMsg 事件 clientSocket.on("sendMsg",function (data,fn) { // data 为客户端发送的消息，可以是 字符串，json对象或buffer // 使用 emit 发送消息，broadcast 表示 除自己以外的所有已连接的socket客户端。 // to(房间名)表示给除自己以外的同一房间内的socket用户推送消息 clientSocket.broadcast.to(data.roomName).emit("receiveMsg",data); fn({"code":0,"msg":"消息发生成功"}); }) });
客户端（2个客户端页面内容一样）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>客户端1</title> </head> <body> <label>房间名:</label> <input type="text" id="txtRoom"/> <button type="button" id="btn-joinRoom">加入房间</button> <button type="button" id="btn-leaveRoom">离开房间</button> <br/> <label>聊天内容:</label><br/> <textarea id="content" style="height: 200px; 300px;"></textarea> <br/> <input id="sendMsg" type="text"/> <button id="btn_send">发送</button> <!-- 首先引入 socket.io 客户端脚本--> <script src="/socket.io/socket.io.js"></script> <script type="text/javascript"> var socket = io.connect();//连接服务端，因为本机使用localhost 所以connect(url)中url可以不填或写 http://localhost // 监听 receiveMsg 事件，用来接收其他客户端推送的消息 socket.on("receiveMsg",function (data) { content.value+=data.client+":"+data.msg+" "; }); var content=document.getElementById("content"); var sendMsg=document.getElementById("sendMsg"); var btn_send=document.getElementById("btn_send"); var btn_joinRoom=document.getElementById("btn-joinRoom"); var btn_leaveRoom=document.getElementById("btn-leaveRoom"); var txtRoom=document.getElementById("txtRoom"); btn_leaveRoom.addEventListener("click",function () { socket.emit("leaveRoom",{"roomName":txtRoom.value},function (data) { //打印离开房间后服务端返回的信息 console.log("离开房间："+ JSON.stringify(data) ) }); txtRoom.value=""; }) btn_joinRoom.addEventListener("click",function () { var roomName=txtRoom.value; socket.emit("joinRoom",{"roomName":roomName},function (data) { //打印加入房间成功后返回的信息 console.log("加入房间："+JSON.stringify(data)); }) }); btn_send.addEventListener("click",function () { if(!sendMsg.value){ alert("请输入房间号");return; } var data={"msg":sendMsg.value,"roomName":txtRoom.value,"client":"客户端1"}; //给服务端发送 sendMsg事件名的消息 socket.emit("sendMsg",data,function (data) { //打印消息发送成功后服务端返回的信息 console.log("消息发送："+JSON.stringify(data)); }); content.value+=data.client+":"+data.msg+" "; sendMsg.value=""; }); </script> </body> </html>
界面效果如下：
