Socket.io进阶-命名空间的使用

原创

挥刀北上

修改于 2021-02-03 10:03:52

1.5K00

代码可运行

文章被收录于专栏：Node.js开发Node.js开发

运行总次数：0

代码可运行

使用socket.io搭建服务器可以使用命名空间，每个命名空间类似于一个独立的管道。

先看一下服务器代码：

const express = require('express');
const http = require('http');
const Io = require('socket.io');

const app = express();
app.use(express.static("./"))
const server = http.Server(app);
const socketServer = Io(server);
server.listen(3000);

let socketServerA = socketServer.of('/a');
//添加命名空间a
socketServerA.on('connection', (socket) => {
    //监听a的连接事件
    socket.on('disconnect', () => {
        //监听用户断开事件
        console.log("用户" + socket.id + "断开连接");
    });

    console.log("用户" + socket.id + "连接");

    socket.on('msg', (data) => {
        //监听msg事件（这个是自定义的事件）
        console.log(data);//你好服务器,我是通过a的命名空间发送的信息
        socket.emit('msg', '你好浏览器，我收到了你的信息');
        //向socket用户发送信息
    })
})

let socketServerB = socketServer.of('/b');
//添加命名空间b
socketServerB.on('connection', (socket) => {
    //监听b的连接事件
    socket.on('disconnect', () => {
        //监听用户断开事件
        console.log("用户" + socket.id + "断开连接");
    });

    console.log("用户" + socket.id + "连接");

    socket.on('msg', (data) => {
        //监听msg事件（这个是自定义的事件）
        console.log(data);//你好服务器,我是通过b的命名空间发送的信息
        socket.emit('msg', '你好浏览器，我收到了你的信息1');
        //向socket用户发送信息
    })
})

阅读源码我们按照前面介绍的socket.io搭建websocket服务器的方法，在这里我们并没有直接用socektServer直接监听connection时间，而是通过websocketServer的of方法对其进行了空间命名，我的理解是将一间房子打了隔断，改成了两间房子。

后面的使用基本一样。

前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<!-- <script crossorigin="anonymous"
    integrity="sha512-ZqQWGugamKhlSUqM1d/HMtwNG+hITmd/ptoof91lt5ojFZ+2bKlkvlzkmnDIrnikDY+UDVZVupLf6MNbuhtFSw=="
    src="https://lib.baomitu.com/socket.io/3.1.0/socket.io.min.js"></script> -->
<script src="/socket.io/socket.io.js"></script>
<script>
    let SocketA = io.connect('http://localhost:3000/a');
    //与a命名空间建立连接
    let SocketB = io.connect('http://localhost:3000/b');
    //同理

    SocketA.emit('msg', '你好服务器,我是通过b的命名空间发送的信息');
    //自定义msg事件，发送‘你好服务器’字符串向服务器
    SocketA.on('msg', (data) => {
        //监听浏览器通过msg事件发送的信息
        console.log(data);//你好浏览器，我收到了你的信息1
    });

    SocketB.emit('msg', '你好服务器,我是通过b的命名空间发送的信息');
    //自定义msg事件，发送‘你好服务器’字符串向服务器
    SocketB.on('msg', (data) => {
        //监听浏览器通过msg事件发送的信息
        console.log(data);//你好浏览器,我收到了你的信息2
    });
</script>
</body>
</html>