Socket.io教程: 基于Express的多聊天室(分组)的简单设计与实现

多聊天室(多个分组)的简单设计概述

  • 相当于实现多个群聊的功能
  • 每个群之间互相不干扰

后端设计

var express = require('express');
var url = require('url');
var app = express();
var server = require('http').Server(app);
var io = require('socket.io')(server);

app.set('view engine','ejs');
app.use(express.static('public'));

app.get('/',function(req,res){
    res.render('index');
})

server.listen(3000,'127.0.0.1');

io.on('connection', function (socket) {
    // console.log('socket配置成功')

    // 获取客户端建立连接的时候传入的值
    //console.log(socket.request.url);
    var groupid = url.parse(socket.request.url,true).query.groupid; // 获取分组号
    //console.log(groupid);

    socket.join(groupid);  // 加入分组

    // 监听客户端发送的事件
    socket.on('clientMsg',function(data){
        //console.log(data)

        // 广播给指定分组的用户 发送消息 两种方式
        // io.to(groupid).emit('serverMsg','Server Ok'); // 通知分组内的所有用户 包括自己
        socket.broadcast.to(groupid).emit('serverMsg','Server Ok'); // 通知分组内的用户不包括自己
    })
});

前端设计

<script src="http://127.0.0.1:3000/socket.io/socket.io.js"></script>

<input type="button" value="发送消息" onclick="sendMsg()">

<script type="text/javascript">
    // 和服务器建立长连接 多个分组传入不同groupid即可实现不同的分组
    var socket = io.connect('http://127.0.0.1:3000?groupid=1');

    // 接收服务器返回的信息
    socket.on('serverMsg',function(data) {
        console.log(data);
    });

    function sendMsg() {
        socket.emit('clientMsg','clientMsg');
    }
</script>

相关说明

  • 不同客户端建立连接时传入不同的groupid即可实现分组, 分组内的通信是同步的,分组之间互不干扰
  • socket.join(groupid); 加入分组
  • io.to(groupid).emit(‘serverMsg’,‘Server Ok’); 通知分组内的所有用户 包括自己
  • socket.broadcast.to(groupid).emit(‘serverMsg’,‘Server Ok’); 通知分组内的用户不包括自己

猜你喜欢

转载自blog.csdn.net/Tyro_java/article/details/106607010