爱星物联——配置与实现MQTT协议的网页端通信

---

前言

MQTT是机器对机器(M2M)/物联网(IoT)连接协议，作为设备与云端通信交互的桥梁，广泛应用于物联网、移动互联网、智能硬件、车联网、电力能源等领域的设备控制。

MQTT介绍

MQTT概念

MQTT(Message Queuing Telemetry Transport),翻译为消息队列传输探测，是一个物联网传输协议,用于轻量级的发布/订阅式消息传输，旨在为低带宽和不稳定的网络环境中的物联网设备提供可靠的网络服务。

MQTT特点

• 开放消息协议，易实现，多语言支持，客户端兼容性高；
• 实时双向通信，一对多消息发布，支持高并发连接；
• 长连接，断开恢复，传输安全可靠；
• 轻级，低功耗，低协议开销；

MQTT通信模式

• 三种身份：发布者（publisher）、代理（broker）、和订阅者（subscriber）；
• 消息传输模式：发布-订阅模式；
• 消息传输内容：主题（topic）、服务质量（QoS）、消息；

MQTT协议通信模型

发布者发布topic消息到代理，代理将该消息推送到所有订阅该topic的订阅者。发布者和订阅者之间无需建立直接连接，而是通过 MQTT Broker 来负责消息的路由和分发。

客户端是指任何运行MQTT库的应用或设备。发布消息的客户端就是发布者，订阅topic消息的客户端就是订阅者。
代理（broker）是负责处理客户端请求的关键组件，包括建立连接、断开连接、订阅和取消订阅等操作，负责消息的转发。一个高效强大的 Broker 能够轻松应对海量连接和百万级消息吞吐量。

在爱星物联平台，客户端有爱星物联开发平台、爱星物联APP、安信可通讯模组，代理（broker）是云平台MQTT服务程序。
如带有安信可通讯模组的彩灯作为客户端连接到了代理（broker）,并将设备开的状态发布到主题report，MQTT Broker 接收到该消息后会负责将其转发给订阅了report主题的订阅者客户端。

MQTT主题（topic）

MQTT 协议根据主题来转发消息体。主题通过 / 来区分层级，类似于 URL 路径。
爱星物联的主题路径组成为{ProductKey}/{DeviceId}/区分行为的字段
如：
{ProductKey}/{DeviceId}/control
{ProductKey}/{DeviceId}/control/ack

MQTT服务质量（QoS）

与主题一起发布/订阅的是服务质量（QoS），MQTT 提供了三种服务质量（QoS），在不同网络环境下保证消息的可靠性。
QoS 0：消息最多传送一次。如果当前客户端不可用，它将丢失这条消息。
QoS 1：消息至少传送一次。
QoS 2：消息只传送一次。

MQTT消息结构

爱星物联的消息结构由协议头（Header）和负载（Payload）组成。
爱星物联MQTT消息结构参考以下：

web客户端MQTT配置

爱星物联开源社区的开发平台提供了MQTT web端对象封装的js文件，需要查看完整代码的童鞋可以借鉴。
地址：https://github.com/ubases/ubases_iot_open_web/blob/main/src/utils/control.js

实践

1. 脚手架安装mqtt

爱星物联web端项目采用的是vue2的框架，这里安装mqtt的2.18.8版本，命令如下：

npm install mqtt@2.18.8
1

2. 引入mqtt

import mqtt from 'mqtt'
1

3. 封装mqtt全局服务

3.1 初始化参数

3.2 连接mqtt，订阅主题，监听连接状态

3.3 发布相应主题的消息，如设置属性

3.4 断开连接

完整代码可查看爱星物联开源云项目：
https://github.com/ubases/ubases_iot_open_web/blob/main/src/utils/control.js

总结

欢迎各位技术大神参与开源云项目体验，爱星物联IoT云平台致力于提供更加成熟、安全、全球化可用的物联网服务，降低投入成本，快速开发 IoT 产品，构建安全稳定且可定制化的 IoT 解决方案。以上就是本期分享的内容，目的在于让大家快速适应新品方案的开发，更多资料可从我们官网上获取。

官方官网：https://www.ai-thinker.com
开发资料：https://docs.ai-thinker.com/
官方论坛：http://bbs.ai-thinker.com
技术支持：support@aithinker.com
爱星物联IoT平台体验网址：https://open.iot-aithings.com