feat: mqtt版本调试
This commit is contained in:
pengqiao1993
@ -42,9 +42,6 @@
|
||||
{{ $t("homePage.mine.submit") }}
|
||||
</button>
|
||||
</view>
|
||||
<mqtt-client :options="mqttOptions" @connect="onConnect" @message="onMessage">
|
||||
|
||||
</mqtt-client>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -55,13 +52,9 @@
|
||||
import {
|
||||
Langlist
|
||||
} from "@/common/lang";
|
||||
import pako from "pako";
|
||||
import mqttClient from '@/uni_modules/yh-wsmqtt/wsmqtt/components/mqtt-client.vue'
|
||||
import * as Paho from "@/static/lib/mqtt.js";
|
||||
import MQTTClient from "@/static/lib/mqtt.js";
|
||||
export default {
|
||||
components: {
|
||||
mqttClient
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
formList: formList,
|
||||
@ -72,47 +65,156 @@
|
||||
mqttClient: null,
|
||||
backData: {},
|
||||
smallArr: [],
|
||||
mqttOptions: {
|
||||
mqttConfig: {
|
||||
host: '13.39.200.14',
|
||||
port: 8083,
|
||||
path: '/mqtt'
|
||||
}
|
||||
clientId: 'mqttx_' + Date.now(),
|
||||
username: 'admin',
|
||||
password: 'zzkj@688737',
|
||||
path: 'mqtt',
|
||||
protocolVersion: 4, // 4 for MQTT 3.1.1
|
||||
clean: false,
|
||||
cleanStart: false, // for MQTT 5.0
|
||||
keepAlive: 60,
|
||||
sessionExpiryInterval: 4294967295,
|
||||
connectTimeout: 10000,
|
||||
reconnectPeriod: 3000
|
||||
|
||||
},
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
language() {
|
||||
return this.$store.state.vuex_language
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
language: {
|
||||
handler(val) {
|
||||
// console.log(val)
|
||||
// this.lang.value = Langlist.find(v => v.prop == val)
|
||||
// console.log(this.lang)
|
||||
},
|
||||
immediate: true,
|
||||
deep: true,
|
||||
},
|
||||
currentStation() {
|
||||
console.log(this.vuex_currentStation)
|
||||
return this.vuex_currentStation;
|
||||
},
|
||||
},
|
||||
|
||||
onShow() {
|
||||
// if (!this.mqttClient) {
|
||||
// this.initMQTT()
|
||||
// }
|
||||
},
|
||||
beforeDestroy() {
|
||||
// if (this.mqttClient) {
|
||||
// this.mqttClient.disconnect()
|
||||
// this.mqttClient = null
|
||||
// }
|
||||
this.connect()
|
||||
},
|
||||
|
||||
methods: {
|
||||
onConnect() {
|
||||
console.log('连接成功')
|
||||
initMQTTClient() {
|
||||
this.mqttClient = new MQTTClient(this.mqttConfig)
|
||||
console.log(this.mqttClient);
|
||||
// 监听连接事件
|
||||
this.mqttClient.on('connect', () => {
|
||||
console.log('MQTT 连接成功')
|
||||
this.publish({
|
||||
topic: '/test',
|
||||
message: {
|
||||
fun: 'GET',
|
||||
type: 'WJ_Get_NewControlSystem',
|
||||
content: 0
|
||||
},
|
||||
qos: 0
|
||||
})
|
||||
})
|
||||
|
||||
// 监听断开事件
|
||||
this.mqttClient.on('disconnect', (res) => {
|
||||
this.connectionStatus = 'disconnected'
|
||||
console.log('连接已关闭')
|
||||
})
|
||||
|
||||
// 监听错误事件
|
||||
this.mqttClient.on('error', (error) => {
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
// 监听状态变化
|
||||
this.mqttClient.on('statusChange', (status) => {
|
||||
console.log(status)
|
||||
})
|
||||
|
||||
// 监听消息事件
|
||||
this.mqttClient.on('message', (msg) => {
|
||||
console.log(msg)
|
||||
})
|
||||
|
||||
// 监听订阅成功事件
|
||||
this.mqttClient.on('subscribed', (packetId) => {
|
||||
this.addLog('success', `订阅成功 (包ID: ${packetId})`)
|
||||
uni.showToast({
|
||||
title: '订阅成功',
|
||||
icon: 'success'
|
||||
})
|
||||
})
|
||||
|
||||
// 监听取消订阅成功事件
|
||||
this.mqttClient.on('unsubscribed', (packetId) => {
|
||||
this.addLog('success', `取消订阅成功 (包ID: ${packetId})`)
|
||||
uni.showToast({
|
||||
title: '取消订阅成功',
|
||||
icon: 'success'
|
||||
})
|
||||
})
|
||||
},
|
||||
onMessage(msg) {
|
||||
console.log('收到消息:', msg)
|
||||
|
||||
|
||||
publish(publishConfig) {
|
||||
const {
|
||||
topic,
|
||||
message,
|
||||
qos
|
||||
} = publishConfig
|
||||
|
||||
if (!topic) {
|
||||
uni.showToast({
|
||||
title: '请输入主题',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (this.mqttClient) {
|
||||
this.mqttClient.publish(topic, message, qos)
|
||||
}
|
||||
},
|
||||
|
||||
subscribe() {
|
||||
|
||||
if (this.mqttClient) {
|
||||
this.mqttClient.subscribe({
|
||||
topic: '/test',
|
||||
qos: 0
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
connect() {
|
||||
const {
|
||||
host
|
||||
} = this.mqttConfig
|
||||
|
||||
if (!host) {
|
||||
uni.showToast({
|
||||
title: '请输入主机地址',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
console.log('开始连接 MQTT 服务器...')
|
||||
|
||||
|
||||
// 如果客户端未初始化，重新初始化
|
||||
if (!this.mqttClient) {
|
||||
this.initMQTTClient()
|
||||
}
|
||||
this.mqttClient.reSetconstructor(this.mqttConfig)
|
||||
|
||||
this.mqttClient.connect()
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
decodeGzipBase64(base64Str) {
|
||||
// 1. base64 → Uint8Array
|
||||
const binaryStr = atob(base64Str);
|
||||
@ -186,77 +288,7 @@
|
||||
console.log('handleInput方法错误:', error);
|
||||
}
|
||||
},
|
||||
initMQTT() {
|
||||
// 创建MQTT客户端实例
|
||||
const clientId = 'client_' + Math.random().toString(36).substr(2, 9);
|
||||
// 使用WebSocket连接方式
|
||||
this.mqttClient = new Paho.Client('13.39.200.14', 8083, clientId);
|
||||
|
||||
// 设置回调函数
|
||||
this.mqttClient.onConnectionLost = this.onConnectionLost;
|
||||
this.mqttClient.onMessageArrived = this.onMessageArrived;
|
||||
|
||||
// 连接选项
|
||||
const options = {
|
||||
onSuccess: this.onConnect,
|
||||
onFailure: this.onFail,
|
||||
userName: 'admin',
|
||||
password: 'zzkj@688737',
|
||||
useSSL: false,
|
||||
timeout: 30,
|
||||
keepAliveInterval: 60,
|
||||
cleanSession: true
|
||||
};
|
||||
|
||||
// 连接到MQTT broker
|
||||
this.mqttClient.connect(options);
|
||||
},
|
||||
onConnect() {
|
||||
console.log('Connected to MQTT broker!');
|
||||
// 订阅主题
|
||||
this.mqttClient.subscribe('WJ_Get_NewControlSystem');
|
||||
// 发送获取数据的消息
|
||||
this.sendMQTTMessage('WJ_Get_NewControlSystem', JSON.stringify({
|
||||
fun: 'GET',
|
||||
type: 'WJ_Get_NewControlSystem',
|
||||
content: 0
|
||||
}));
|
||||
},
|
||||
onFail(error) {
|
||||
console.error('Failed to connect:', error);
|
||||
},
|
||||
onConnectionLost(responseObject) {
|
||||
if (responseObject.errorCode !== 0) {
|
||||
console.log('Connection lost: ' + responseObject.errorMessage);
|
||||
}
|
||||
},
|
||||
onMessageArrived(message) {
|
||||
console.log('Message arrived:', message.payloadString);
|
||||
try {
|
||||
// let data = JSON.parse(message.payloadString);
|
||||
// if (data.type == 'WJ_Get_NewControlSystem') {
|
||||
// this.control(data.content);
|
||||
// }
|
||||
} catch (error) {
|
||||
console.log('解析MQTT消息错误:', error);
|
||||
}
|
||||
},
|
||||
sendMQTTMessage(topic, payload) {
|
||||
if (this.mqttClient && this.mqttClient.isConnected()) {
|
||||
const message = new Paho.Message(payload);
|
||||
message.destinationName = topic;
|
||||
this.mqttClient.send(message);
|
||||
console.log('MQTT消息发送成功:', payload);
|
||||
} else {
|
||||
console.log('MQTT客户端未连接');
|
||||
if (!this.mqttClient) {
|
||||
this.initMQTT();
|
||||
}
|
||||
setTimeout(() => {
|
||||
this.sendMQTTMessage(topic, payload);
|
||||
}, 1000);
|
||||
}
|
||||
},
|
||||
toback() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
@ -269,17 +301,22 @@
|
||||
pre[cur.prop] = Number(pre[cur.prop])
|
||||
return pre
|
||||
}, {})
|
||||
this.sendMQTTMessage("WJ_Set_NewControlSystem", JSON.stringify({
|
||||
fun: 'SET',
|
||||
type: 'WJ_Set_NewControlSystem',
|
||||
content: {
|
||||
...this.backData,
|
||||
params: {
|
||||
...this.backData.params,
|
||||
...smallParam
|
||||
this.publish({
|
||||
topic: '/test',
|
||||
message: {
|
||||
fun: 'SET',
|
||||
type: 'WJ_Set_NewControlSystem',
|
||||
content: {
|
||||
...this.backData,
|
||||
params: {
|
||||
...this.backData.params,
|
||||
...smallParam
|
||||
}
|
||||
}
|
||||
}
|
||||
}))
|
||||
},
|
||||
qos: 0
|
||||
})
|
||||
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user