前言
MQTT是基于发布订阅模式的轻量级物联网消息传输协议，可以提供实时可靠的消息服务。像聊天、消息推送这样的场景都可以使用MQTT。mqtt.js是一个实现了mqtt客户端的JS库，既可以用在node.js也可以用在浏览器端。笔者最近接触的一个微信小程序项目中有聊天和推送的场景，所以提前调研了一下微信小程序中如何使用mqtt.js连接mqtt服务器，欢迎阅读本文一起学习。
在微信小程序中是可以使用三方的npm包的，所以使用mqtt.js既可以通过npm的方式也可以通过mqtt的压缩文件，但经过笔者测试，npm的方式使用mqtt有很多问题，下面详细介绍通过压缩文件的方式安装和使用mqtt。
1.下载文件mqtt的压缩文件
mqtt.js提供了压缩文件形式的资源，详见文档，下图为打开资源地址后的网页：
在此网页上点击【右键】，然后选择【另存为】将mqtt的压缩文件保存到本地：
这样就完成了mqtt.js压缩文件的下载。
2.引入mqtt.min.js文件
将下载到本地的mqtt.min.js拷贝到项目的utils目录下，如下图所示：
在要使用mqtt的小程序页面对应的.ts或者.js文件中引入mqtt，如下图所示：
如果能够在调试控制台看到mqtt被打印出来，则说明mqtt引入成功，如下图：
3.连接mqtt服务器
成功引入mqtt之后我们要来连接mqtt服务器。
3.1 成功连接的前提：服务器域名已配置
要想成功连接mqtt服务器端的前提就是在开发者后台中提前配置好服务器域名，如下图所示：
域名配置成功后还要注意检查一下当前小程序的AppId是否和小程序后台中的AppId是否一致，如下图：
笔者在开发过程中就遇到了坑：不知道什么操作导致当前正在开发的小程序的AppId不和小程序后台的AppId一样，导致连接mqtt时提示没有配置域名，如下图所示：
3.2 解决一个个报错，最终连接成功
当使用mqtt.connect方法连接mqtt服务器时，首先遇到的报错如下：
点击报错信息后面的链接可以查看解决办法，文档中介绍了两种解决方式，如下图示示：
笔者采用的是第一中解决办法，如下图所示：
如上问题解决之后又开始出现新的报错，如下图所示：
有些文章说肯能mqtt的版本太高了要换成3.0.0的版本，我们可以把mqtt.min.js的下载地址中版本号换成3.0.0即可下载3.0.0版本的mqtt, 如下图所示：
换成了3.0.0版本的之后还是报错，如下图示：
经和官方文档以及相关文章的对比，笔者发现原来自己写的连接的url不正确，不能用wss而应该使用wxs,如下图所示：
总结
微信小程序使用mqtt可以通过npm的方式也可以通过压缩文件的方式，本文介绍的是通过压缩文件的方式；要通过压缩文件的方式使用mqtt，首先需要把压缩文件下载到本地，使用前要导入，如后续有报错解决不了可能要考虑换一个低版本的mqtt压缩文件；连接的时候注意是否已经在服务器域名中配置mqtt的服务器域名，还要注意连接url的协议要为wxs等。
参考资料
微信小程序连接mqtt指南
使用微信小程序连接到 MQTT 云服务
微信小程序+mqtt.js实现实时接收消息
微信小程序—连接MQTT
解决 uniapp报错：TypeError: WebSocket is not a constructor
uniapp 报错TypeError: WebSocket is not a constructor