MQTT通信在JS中的实现

MQTT协议(Message Queuing Telemetry Transport)消息队列遥测传输是由 IBM 发布的一种基于发布/订阅范式的“轻量级”消息协议，工作于TCP/IP协议族之上。
它是一种低开销，低带宽占用的即时通讯协议，可以用极少的代码和带宽的为连接远程设备提供实时可靠的消息服务，它适用于硬件性能低下的远程设备以及网络状况糟糕的环境下，由于这些特点，它可用于机器与机器之间的通信以及IoT(物联网)环境。
在MQTT中有一些重要的概念，如：服务端，客户端，主题等。

MQTT服务端

MQTT 服务段也称为 Broker（消息代理），它可以是一个应用程序或一台设备，位于消息发布者 和订阅者之间

作用

1. 接受客户端的网络连接请求
2. 接受客户端发布的应用信息
3. 处理来自客户端的订阅以及取消订阅请求
4. 向订阅主题的客户端转发消息

MQTT客户端

一个使用 MQTT 协议的设备、应用程序等，它总是建立到服务器的网络连接

PS：一会就是实现的这一部分

作用

1. 发布信息，其他客户端可以通过订阅主题来获取这些信息

发布信息的客户端本身也会收到该信息

1. 订阅主题，获取其它客户端发布的消息
2. 取消订阅，或删除消息

MQTT主题

连接到一个应用程序消息的标签，该标签与服务器的订阅相匹配。服务器会将消息发送给订阅所匹配标签的每个客户端。

即根据订阅的主题发布或获取消息

QoS（消息传递的服务质量水平）

服务质量，标志表明此主题范围内的消息传送到客户端所需的一致程度

• 0：不可靠，消息基本上仅传送一次，如果当时客户端不可用，则会丢失该消息。
• 1：消息应传送至少 1 次。
• 2：消息仅传送一次。

JS实现MQTT客户端

这里我们使用第三方库MQTT.js，来创建。MQTT.js官网

1. 首先在项目环境下安装MQTT.js

pnpm add mqtt

1. 对将要创建的client进行配置

const options: IClientOptions = {
  connectTimeout: 4000, // 连接超时时间 
  reconnectPeriod: 1000,// 重连间隔
  clientId: "yl_client",// 客户端id，在服务端所呈现的名称
  protocol: "mqtt", // 协议
  host: "broker.emqx.io", // 服务器主机地址，这里是一个公共服务器地址
  port: 1883, // 端口号
}

1. 根据上面的options创建客户端

const client = connect(options)

1. 事件监听
   上面创建的client，提供了许多事件让我们监听，也就让我们可以在合适的时间做合适的事

• connect: 连接成功时触发
• message：client收到一个发布过来的 Payload 时触发
• reconnect：重连时触发
• error：client无法成功连接时或发生解析错误时触发
• close：断开连接时触发
  这里我们先在connect时，来订阅我们的主题

// 定义一个mes用于发布
const MES = {
  mes: "hello MQTT",
}
client.on("connect", () => {
  console.log("Connected")
  // 订阅主题：多个或一个主题，回调在订阅成功后触发
  client.subscribe(["test"], () => {
    console.log(`Subscribe to topic '${"test"}'`)
  })
  // 向服务器推送消息：推送消息的主题，数据，qos配置，错误回调
  client.publish(
    "test",
    JSON.stringify(MES),
    { qos: 2 }, // 设置消息质量
    (error) => {
      if (error) {
        console.error(error)
      }
    }
  )
})

然后有消息时来处理服务端发过来的数据

// 监听事件：有消息时触发，回调第一个参数是主题，第二个参数是获取到的数据（buffer）
client.on("message", (topic, message) => {
  const mes_str = message.toString()
  let mes_json = JSON.parse(mes_str)
  console.log("来自主题：", topic)
  console.log("获取到消息：", mes_json)
})

这样做完之后，我们就可以收到主题test相关的消息了，下面是过了一段时间后的结果

结束语

这部分内容，是这会毕业设计要用到的东西，事发突然，大概也就是这些内容了吧