全国咨询热线:18720358503

济宁微信小程序商城_uniapp,微信小程序中使用 M

类别:媒体报道 发布时间:2021-01-05 浏览人次:

uniapp,微信小程序中使用 MQTT的问题     ,别跑   这篇文章主要介绍了uniapp,微信小程序中使用 MQTT的问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

最近在uniapp打包成微信小程序的项目中第一次用到了MQTT。使用比较简单,但是还是遇到了一些问题。在此记录一下。

官方文档:

官方MQTT测试工具:。

MQTT的js文件:

先上一点注意事项:

(1)MQTT.js 一个 MQTT 协议的客户端库,用 JavaScript 编写,可用于 Node.js 和浏览器。在 Node.js 端可以通过全局安装使用命令行连接,同时还支持 MQTT ,MQTT TLS 证书连接;值得一提的是 MQTT.js 还对微信小程序有较好的支持。

(2)MQTT可以通过三种方式连接,TCP直连, TLS和WebSocket,但是JavaScript使用 TCP 只能通过 ws 即 Websocket 链接。所以如果服务器是TCP直连,客户端是肯定连不上的,会报 Error in connection establishment 的错误。所以客户端协议只能是ws,wss,wxs(微信)

(3)WebSocket 是一种在单个 TCP 连接上进行全双工通讯的协议。作为一种通信协议,其使用 ws(非加密)、wss(SSL 加密) 作为协议标识。MQTT.js 客户端支持多种协议,连接地址需指明协议类型;

(4)ws: 未加密的 WebSocket 连接,一般使用8083端口。wss: 加密的 WebSocket 连接,一般使用8084端口。mqtt: 未加密的 TCP 连接,一般使用1883端口。mqtts: 加密 TCP 连接。

贴一下代码:

import $mqtt from './mqtt.min.js';
const mqttOptions = {
 keepalive: 30,
 clean: false, 
 connectTimeout: 5000, // Timeout
 clientId: uni.getStorageSync('clientId'),
 // username: 'test',
 // password: 'test',
const connectUrl = `${mqttHost}:${mqttPort}/mqtt`;
// #ifdef H5
var client = $mqtt.connect('wss://' + connectUrl, mqttOptions);
// #endif
// #ifdef MP-WEIXIN||APP-PLUS
var client = $mqtt.connect('wxs://' + connectUrl, mqttOptions);
// #endif
client.on('connect', () = {
 console.log('connect')
 // 这是为了给自己发条消息,其它无作用
 client.subscribe('test', (err) = {
 if (!err) {
 client.publish('test', '{}')
// 自动重连
client.on('reconnect', (msg) = {
 console.log('reconnect', msg)
// 错误
client.on('error', () = {
 console.log('error')
// 断开
client.on('end', () = {
 console.log('end')
// 掉线
client.on('offline', (msg) = {
 console.log('offline',msg)
// 收到消息 
client.on('message', (topic, message) = {
 // 把arrayBuffer转成字符串
 let encodedString = String.fromCharCode.apply(null, new Uint8Array(message));// 全局发送消息
 uni.$emit('sendTopicMsg',encodedString);
 console.log(encodedString)
// 全局监听是否有关闭mqtt的消息的事件
uni.$on('closeMqtt',() = {
 client.end(true); // 主动断开连接
})

说明:

(1) 配置项里的 keepAlive 指的是心跳时间。以秒为单位。定义服务端从客户端接收到消息的最大间隔时间。可以设置为0,表示客户端一直不断开,除非主动断开。

(2) clean 设置为false,是为了让客户端掉线的时候,服务器必须在客户端断开之后继续存储/保持客户端的订阅状态。即当为true的时候,如果掉线了,服务端会清理链接状态的数据和内容。当为false的时候,服务端会保存消息发送期间,链接断开导致发送失败的消息。这样连上的时候就会自动推送到订阅的客户端。

(3) 如果连接需要验证用户名和密码,则需要加上username和password字段。

(4) 微信小程序使用的协议,如果不是加密的,则是 wss,如果是加密的,就是 wxs。web端,一般不加密就是 wx,加密就是wss。

(5) 前端收到的消息是 arrayBuffer 格式的,需要转成字符串格式,如果带有中文,可能转成字符串会乱码。可以使用let decodeString = decodeURIComponent(escape((encodedString))) 来避免中文乱码。或者是网上通过移位转成中文的方法来解决。

(6) clientId 是使用Math.random().toString(36).substr(3,自定义长度) 来生成自定义长度的的唯一id。

应该是免费的测试MQTT消息的链接:o(∩_∩)o


(1) CA signed server 这个直接在MQTTX测试工具里面 选择 SSL/TLS 勾选为true时即可选择。

(2) 测试的时候,先填好内容,然后链接上的时候,再添加一个订阅,Topic就填一会你需要发送消息的Topic,这样当你模拟服务器发送消息的时候,MQTTX里面也会收到你刚才发送的内容,这样就是连通了。

开发过程中遇到的问题:

(1)如果出现failed: Connection closed before receiving a handshake response这个错误。说明 服务端的 mqtt 协议和客户端的协议不一样,就比如python用的是基于 tcp 的 mqtt ,js是基于websocket 的 mqtt,都不能达成握手的操作。出现这个的问题应该是:服务端使用了1883这个端口,而客户端也是用这个端口,就导致这个问题。正确的应该是:客户端(js)应该使用8083端口(未加密)。

(2) 最初我设置心跳时间是3秒,在微信开发者工具,或者H5端的时候,是没有问题的。但是在小程序真机调试里,当小程序切换到后台,差不多5s就会自动断开,然后一直重连,直到切换回小程序,重连成功。而且有时候还会连续断开和重连。自动断网这个原因,小程序官网做了说明的:在第二条 网络请求 - 使用限制里面就说明了,小程序的机制,限制了切换到后台之后网络的处理。所以把心跳时间改为30s,让 mqtt 30秒之后再自动重连。但是这样只是为了让体验稍微好一点,不会出现切换出去5s就断开链接,再切回来一直提示重连的问题。不过可以把心跳时间改为0,表示一直连接不断开。

总结:

(1)以上对mqtt的了解也只是一知半解,还没弄明白这里的心跳时间,和 TCP/IP 的心跳机制是不是一样的。超过心跳时间,能不能让客户端不掉线,或者有没有更好的解决离线的办法。

(2)而且还有很多特性都没用到,比如will遗愿标志,专门用来处理客户端断开连接的配置项。

(3)由于这个项目都是用的Qos0的消息,都不知道与Qos1,Qos2的区别是什么。

到此这篇关于uniapp,微信小程序中使用 MQTT的文章就介绍到这了,更多相关微信小程序MQTT内容请搜索凡科以前的文章或继续浏览下面的

推荐阅读

济宁微信小程序商城_uniapp,微信小程序中使用 M

uniapp,手机微信微信小程序中应用 MQTT的难题 ,别跑 本文关键详细介绍了uniapp,手机微信微信小程序中应用 MQTT的难题,文中给大伙儿详细介绍的十分详尽,对大伙儿的学习培训或工...

2021-01-05
广州凡科互联网科技股份有限公司招聘社群运营

招聘人数:19职位信息职位描述1.负责母婴/美妆类用户社群的规划与执行,推进社群裂变活动,吸引精准流量加入社群。2.对社群核心用户进行挖掘与互动,通过制定与完善社群运营计划...

2021-01-05
新网站,网站收录,网站SEO优化,深圳SEO优化

从大学毕业到如今,网编一直都会深圳市做SEO提升。网编发觉有许多网站都出現过只百度收录而免收录内容页的状况,乃至有的首页早已被百度收录好多个月了,而内容页却自始至终不...

2021-01-05
微信小程序怎么挣钱-法律律师网站设计制作

4006-3721-06 / 够极致有着十五年英中韩文法律法规刑事辩护律师制造行业企业网站建设制作工作经验,本页是法律法规刑事辩护律师模版网站展现页,后台管理有着很多原版网站模版能够...

2021-01-05
广州凡科互联网科技股份有限公司招聘Ebay销售

招聘人数:14职位信息岗位职责:按照销售主管的要求,维护网络销售店铺的内容。按照销售主管的要求,组织店铺内的促销活动。作为客户和仓库发货人员的桥梁,处理客户订单信息。...

2021-01-05
广州凡科互联网科技股份有限公司招聘课程销售

招聘人数:28职位信息在广州,一个人漂,是很孤独的。为什么不选择一个温暖的归宿呢?就在这里了。 你需要做的事情:1.通过电话和微信与家长进行顾问式销售,在充分识别家长需求...

2021-01-05
X

400-8700-61718720358503
企业邮箱2639601583@qq.com
官方微信