Emqx3.4.4(企业版试用) web端 js实现消息的发布接收

本文只介绍如何进行消息的发布，接收，至于emqx服务器需要靠 小伙伴们自己
本文章emq服务器为企业版试用，但消息的接收发布与emqx broker是一样的

Paho.mqtt.js
Paho 是 Eclipse 的一个 MQTT 客户端项目，Paho JavaScript Client 是其基于浏览器 JavaScript 运行环境的库，它使用 WebSockets 连接到 MQTT 服务器。相较于 MQTT.js 来说，其功能较少，不推荐使用。

MQTT.js 可用于 Node.js 环境和浏览器环境。在 Node.js 上可以通过全局安装使用命令行连接，同时还支持 MQTT ，MQTT TLS 证书连接；值得一提的是 MQTT.js 对微信小程序有较好的支持。

实现一个简单的客户端
mqtt.js 在浏览器环境下支持 WebSocket MQTT 连接，Node.js 环境下支持 TCP(SSL/TLS) MQTT 连接，请根据您的使用场景选择对应的连接方式：

• 使用 connect() 函数连接并返回一个 client 实例

• client 有多个事件，在 client 事件中使用回调函数处理相关逻辑：

  • connect：连接成功事件
  • reconnect：连接错误、异常断开后重连的事件 error：连接错误、终止连接事件
  • message：收到订阅消息事件

• client有多个基本函数

  • 使用 subscribe() 函数订阅主题
  • 使用 publish() 函数发布消息
  • 使用 end() 函数连断开和 broker 的连接
    这里我们只对 MQTT.js 客户端做简单的介绍，关于该客户端的更详尽的说明请参阅 MQTT.js 文档

好了 直接上代码：

运行该html后，在emqx管理界面可以看到订阅信息

连接信息

在管理界面自带的工具消息，看看web界面能收到消息不，输入用户名，密码，点击连接

发布消息 这里的topic 必须和web端订阅的topic保持一致，否则web端会收不到消息，Payload 就是我们发送的消息内容，点击发布按钮，消息就发送了

然后看web界面 已经收到消息了，就完成啦