学习 Socket.io

Posted 2020-11-25 bfjdbcs

学习 Socket.io

官网：Socket.io

初次学习用于即时通信的技术，现将自己对 Socket.io 的理解记录在此，技术细节可以查看相关文档。

即时通信主要由服务端和客户端构成，服务端有一个，客户端有多个，Socket.io 实现了服务端与客户端的双向通信，因此可以进行即时通信。

简述

Socket.io 主要涉及到两个对象： Server 和 socket （有服务端 socket 和 客户端 socket ）。

大致的工作流程： 服务端需要启动一个 Server 进行监听， 客户端起一个 socket 去连接服务端，服务端接受并建立起连接，此时得到服务端 socket 。

服务端

Server API | socket.io

Server

Server 主要功能有监听客户端的连接请求、划分命名空间（NameSpace）、向命名空间（NameSpace）内发送消息。

server.on(eventName, callback)

server 监听事件
主要作用是监听客户端建立连接，连接成功后，服务端 socket 将作为回调函数的参数

• eventName: 主要是监听 connect 事件，
• callback: function(socket){ } 回调函数的参数是 socket

const server = require("socket.io")(3000);
server.on("connect", function(socket) {
    console.log("on connect", socket.id);
});

server.of(namespace)

建立一个命名空间（NameSpace）

• namespace (String|RegExp|Function)
• Returns Namespace

namespace 可以理解为频道，也可以理解为服务的不同地址或不同路由，可以用来划分业务
server 默认的 namespace 就为 ‘/‘
返回的 NameSpace 对象与 Server 相似

server.on('connect',function(socket){ });
// 等同
server.of('/').on('connect', function(socket){ });

server.emit(eventName[, args])

向所有连接的客户端发送事件

• eventName: string 自定义事件名称
• args 发生事件时传递的数据

server - socket

socket 可以理解为服务端与客户端连接而建立的管道，管道两头分别是服务端和客户端。

服务端 socket 监听客户端 socket 发送的事件，也可以向其他房间、其他客户端发送事件。

socket.id

连接身份的唯一标志，是一段字符串

socket.on(eventName, callback)

监听事件客户端 socket 发送的事件

• eventName 事件名称
  • 包括 disconnect事件，当客户端断开时会监听到此事件
  • 包括 error事件，当发生错误时触发
  • 也可以是自定义事件
• callback 回调函数，客户端发送的信息将作为回调函数的参数
• Returns Socket

socket.emit(eventName[, ...args][, ack])

socket 向客户端触发事件

• eventName 自定事件名称
• ...args 要发送的各种数据，支持各种类型的数据
• ack: function 应答函数，在客户端回应后调用

// server code
server.on('connection', (socket) => {
  socket.emit('chat', 'hello', (data) => {
    console.log(data); // data will be 'i got'
  });
});
// the client code
client.on('chat', (name, fn) => {
   fn('i got');
});

• Returns Socket

socket.rooms

socket 所在房间

socket.join(room[, callback])

进入房间

socket.leave(room[, callback])

离开房间

socket.to(room)

向某房间或其他客户端发送私人消息

客户端

Client API | socket.io

socket

客户端 socket 主要作用是连接服务器，向服务端发送事件，和监听服务端发送的事件。

// 导入
// <script src="/socket.io/socket.io.js"></script>
// or 
// const io = require('socket.io-client');
// or
import io from 'socket.io-client';

// 建立连接
// 默认地址
const socket = io();
// 指定地址
const socket = io('http://localhost');
// 指定的 namespace
const socket = io('/news');
const socket = io('http://localhost/news');

socket.id

socket.connected

socket.emit(eventName[, ...args][, ack])

socket.on(eventName, callback)

Event

客户端可监听的各种事件

    socket.on('connect', () => {});
    socket.on('myevent', () => {});
    socket.on('connect_error', (error) => {});
    socket.on('connect_timeout', (timeout) => {});
    socket.on('error', (error) => {});
    socket.on('disconnect', (reason) => {});
    socket.on('reconnect', (attemptNumber) => {});
    //....