更新原生小程序封装(新增缓存订阅)完美解决
import mqtt from '../utils/mqtt.min'let client = null
let topicCallbacks = {} // 每个 topic 对应页面回调
let pendingSubscribes = [] // 连接前缓存订阅const options = {protocolVersion: 4,clean: true,reconnectPeriod: 1000,connectTimeout: 30 * 1000,resubscribe: true,clientId: 'wx_' + Math.random().toString(16).substr(2, 8),username: '',password: '',
}const mqttHost = ''const MQTT = {connect() {if (client && client.connected) returnclient = mqtt.connect(mqttHost, options)client.on('connect', () => {console.log('MQTT连接成功')// 重连后重新订阅所有 topicObject.keys(topicCallbacks).forEach(topic => {client.subscribe(topic)})// 处理连接前缓存的订阅pendingSubscribes.forEach(({ topic, callback }) => {topicCallbacks[topic] = callbackclient.subscribe(topic)})pendingSubscribes = []})client.on('message', (topic, message) => {const payload = message.toString()// 调用页面回调if (topicCallbacks[topic]) topicCallbacks[topic](payload)})client.on('error', (err) => console.error('MQTT连接失败', err))client.on('reconnect', () => console.log('正在重连...'))client.on('close', () => console.log('MQTT连接已断开'))},subscribe(topic, callback) {if (!client || !client.connected) {console.log('客户端未连接,缓存订阅', topic)pendingSubscribes.push({ topic, callback })return}topicCallbacks[topic] = callbackclient.subscribe(topic, { qos: 0 }, (err) => {if (!err) console.log(`已订阅:${topic}`)else console.error('订阅失败', err)})},unsubscribe(topic) {if (!client || !client.connected) returnclient.unsubscribe(topic, () => {delete topicCallbacks[topic]console.log(`取消订阅:${topic}`)})},publish(topic, message, qos = 0) {if (!client || !client.connected) {console.error('MQTT未连接,消息发布失败')return}// 保证消息是字符串const payload = typeof message === 'string' ? message : JSON.stringify(message)client.publish(topic, payload, { qos }, (err) => {if (err) console.error(`发布到 ${topic} 失败:`, err)else console.log(`消息已发布到 ${topic}:`, payload)})},end() {if (client) {client.end(true) // true 表示强制断开,不等待未发送的消息client = nulltopicCallbacks = {}pendingSubscribes = []console.log('MQTT连接已断开')}},isConnected() {return !!(client && client.connected)},// 为兼容旧代码,disconnect 指向 enddisconnect() {this.end()}
}export default MQTT
app.js全局连接,onshow连接,onhide断联
if (!MQTT.isConnected()) {// 需要恢复连接时调用MQTT.connect();}onHide(){MQTT.disconnect();console.log("全局hide");},页面级别订阅和接受消息
MQTT.subscribe(`${openIdtoc}`, (payload) => {console.log("解析后的数据11111111111111:", payload);try {} catch (err) {console.log("消息不是 JSON,原始内容:", payload);}})
