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

2021-02-03 18:03:52 浏览数 (1)

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

先看一下服务器代码:

代码语言:javascript复制
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方法对其进行了空间命名,我的理解是将一间房子打了隔断,改成了两间房子。

后面的使用基本一样。

前端代码:

代码语言:javascript复制
<!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>

前端代码我们分别有io函数连接不通过空间的websocektserver从而得到对应的socket,这样就达到了空间命名的作用。

以上便是socket.io的空间命名的使用,主要是后端of方法的使用和前端连接是追加路径从而连接不同的socket,希望对你有所帮助。

0 人点赞