记录一次vue3+mqtt.js连接华为云mqtt的成功经历

首先我用到的开发工具是uniapp+vue3

先贴一个mqttjs官网的示例地址：

MQTT.js教程

官方示例：

const mqtt = require('mqtt')/**** 浏览器环境* 使用协议为 ws 和 wss 的 MQTT over WebSocket 连接* EMQX 的 ws 连接默认端口为 8083，wss 为 8084* 注意需要在连接地址后加上一个 path, 例如 /mqtt*/
const url = 'ws://broker.emqx.io:8083/mqtt'
/**** Node.js 环境* 使用协议为 mqtt 和 mqtts 的 MQTT over TCP 连接* EMQX 的 mqtt 连接默认端口为 1883，mqtts 为 8084*/
// const url = 'mqtt://broker.emqx.io:1883'// 创建客户端实例
const options = {// Clean sessionclean: true,connectTimeout: 4000,// 认证信息clientId: 'emqx_test',username: 'emqx_test',password: 'emqx_test',
}
const client = mqtt.connect(url, options)
client.on('connect', function () {console.log('Connected')// 订阅主题client.subscribe('test', function (err) {if (!err) {// 发布消息client.publish('test', 'Hello mqtt')}})
})// 接收消息
client.on('message', function (topic, message) {// message is Bufferconsole.log(message.toString())client.end()
})

我按照以下的写法均连接失败：

const client = mqtt.connect('mqtt://{hostname}:1883', options)// 基于其他平台的本能之选
const client = mqtt.connect('mqtt://{hostname}:1883/mqtt', options)// 有博客说要加mqtt路径
const client = mqtt.connect('ws://{hostname}:8083/mqtt', options)// 有博客说mqtt本质上是ws协议，得用8083接口

但是实际上华为云的连接方式完全不同：

const client = mqtt.connect('wss://{hostname}:443/mqtt', options)

H5 端禁止直接使用 tcp 协议（浏览器安全限制），必须用 wss:// 且端口为 443，同时华为云的 WebSocket 连接需要加路径 /mqtt（关键！很多人忽略这个路径导致连接无响应）。

并且华为云 IoT 平台的 WebSocket 连接必须包含/mqtt路径，否则会连接失败。

至于为什么用443，华为云的文档中也没有找到明确的解释，期待大佬解答。