uniapp 连接MQTT

简单介绍:通过连接mqtt获取网关实时数据。

温馨提示:微信开发者工具连接成功,真机测试和手机预览拒绝连接原因可能是mqtt.js版本的问题,官方已经修复,最好使用最新版。

去Github下载MQTT.js 库;https://github.com/mqttjs/MQTT.js

代码:在当前页面引入mqtt.js

import $mqtt from './mqtt.js'

然后进行mqtt的连接:

//mqtt连接
const mqttOptions = {
keepalive: 0,
clean: true,
connectTimeout: 4000, // Timeout
clientId: '',
username: 'xxxxx',用户名
password: 'xxx',密码
}
const connectUrl = 'file.xxxx.com:443/ws/mqtt';//WebSocket 连接
var client = $mqtt.connect('wxs://' + connectUrl, mqttOptions);
client.on('connect', () => {
console.log('connect')
// 订阅主题
client.subscribe('输入主题内容', (err) => {
if (!err) {
// client.publish('gatewaysend-znz', '{}')
}
})




});
// 自动重连
client.on('reconnect', (msg) => {
console.log('reconnect', msg);
uni.showToast({
title: '自动重连',
icon: 'error',
duration: 2000
})
});
// 错误
client.on('error', () => {
console.log('error');
uni.showToast({
title: '出错了',
icon: 'error',
duration: 2000
})
});
// 断开
client.on('end', () => {
console.log('end');
uni.showToast({
title: 'MQTT断开',
icon: 'error',
duration: 2000
})
});
// 掉线
client.on('offline', (msg) => {
console.log('offline', msg);
uni.showToast({
title: '掉线',
icon: 'error',
duration: 2000
})
});

// 收到消息
client.on('message', (topic, message) => {
// 把arrayBuffer转成字符串
// console.log(message);
//接收到的信息
let json = JSON.parse(message);}

// 全局监听是否有关闭mqtt的消息的事件
uni.$on('closeMqtt', () => {
console.log(22)
client.end(true);
// 主动断开连接
})

json就是接收的数据

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

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

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

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

posted @   脆脆啥  阅读(2662)  评论(1编辑  收藏  举报
相关博文:
阅读排行:
· 使用C#创建一个MCP客户端
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· ollama系列1:轻松3步本地部署deepseek,普通电脑可用
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示