基于socket.io+express实现多房间聊天

基于socket.io+express实现多房间聊天

socket.io简介

Socket.IO是一个开源的WebSocket库，它通过Node.js实现WebSocket服务端，同时也提供客户端JS库。Socket.IO支持以事件为基础的实时双向通讯，它可以工作在任何平台、浏览器或移动设备。

Socket.IO支持4种协议：WebSocket、htmlfile、xhr-polling、jsonp-polling，它会自动根据浏览器选择适合的通讯方式，从而让开发者可以聚焦到功能的实现而不是平台的兼容性，同时Socket.IO具有不错的稳定性和性能。

多房间聊天

socket.io提供rooms和namespace的API

用rooms的API就可以实现多房间聊天了，总结出来无外乎就是：join/leave room 和 say to room

// join和leave

io.on('connection', function(socket){

socket.join('some room');

// socket.leave('some room');

});

// say to room

io.to('some room').emit('some event'):

io.in('some room').emit('some event'):

代码 github

新建文件夹chatapp-demo

chatapp-demo/package.json

{

"name": "chatapp-demo",

"version": "1.0.0",

"description": "multi room chat app demo, powered by socket.io",

"main": "app.js",

"dependencies": {

"express": "^4.13.3",

"hbs": "^3.1.0",

"path": "^0.11.14",

"socket.io": "^1.3.6"

},

"devDependencies": {},

"author": "wuyanxin",

"license": "ISC"

}

执行 npm install

服务端代码

增加文件 chatapp-demo/app.js

var express = require('express');

var path = require('path');

var IO = require('socket.io');

var router = express.Router();

var app = express();

var server = require('http').Server(app);

app.use(express.static(path.join(__dirname, 'public')));

app.set('views', path.johttp://in(__dirname, 'views'));

app.set('view engine', 'hbs');

// 创建socket服务

var socketIO = IO(server);

// 房间用户名单

var roomInfo = {};

socketIO.on('connection', function (socket) {

// 获取请求建立socket连接的url

// 如: http://localhost:3000/room/room_1, roomID为room_1

var url = socket.request.headers.referer;

var splited = url.split('/');

var roomID = splited[splited.length - 1]; // 获取房间ID

var user = '';

socket.on('join', function (userName) {

user = userName;

// 将用户昵称加入房间名单中

if (!roomInfo[roomID]) {

roomInfo[roomID] = [];

}

roomInfo[roomID].push(user);

socket.join(roomID); // 加入房间

// 通知房间内人员

socketIO.to(roomID).emit('sys', user + '加入了房间', roomInfo[roomID]);

console.log(user + '加入了' + roomID);

});

socket.on('leave', function () {

socket.emit('disconnect');

});

socket.on('disconnect', function () {

// 从房间名单中移除

var index = roomInfo[roomID].indexOf(user);

if (index !== -1) {

roomInfo[roomID].splice(index, 1);

}

socket.leave(roomID); // 退出房间

socketIO.to(roomID).emit('sys', user + '退出了房间', roomInfo[roomID]);

console.log(user + '退出了' + roomID);

});

// 接收用户消息,发送相应的房间

socket.on('message', function (msg) {

// 验证如果用户不在房间内则不给发送

if (roomInfo[roomID].indexOf(user) === -1) {

return false;

}

socketIO.to(roomID).emit('msg', user, msg);

});

});

// room page

router.get('/room/:roomID', function (req, res) {

var roomID = req.params.roomID;

// 渲染页面数据(见views/room.hbs)

res.render('room', {

roomID: roomID,

users: roomInfo[roomID]

});

});

app.use('/', router);

server.listen(3000, function () {

console.log('server listening on port 3000');

});

客户端代码

新增chatapp/views/room.hbs

昵称:

房间: {{roomID}}

当前在线人数: {{users.length}}

在线用户:

按Enter键发送

退出房间

新增 chatapp/public/index.html

欢迎您,骚年

房间列表

http://

运行效果

代码已放在github https://github.com/wuyanxin/chatapp-demo.git

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。