mqtt 数据关联

1，分为订阅主题和发布主题

2，mqtt中创建的是订阅主题，案例中的实际情况就必须是发布主题

3，代码实现

data(){
       devicelist: [
					{
						name: '数据监测',
						isDevice: true,
					},
					{
						name: '视频监测'
					},
					{
						name: '远程操作'
					},
				],
				num: 0,
				btnnum: 0,
				act: 0,
				info: '',
				url: '',
				DYSHUJU1: '',
				DYSHUJU2: '',
				DYSHUJU3: '',
				DYSHUJU4: '',
				DYSHUJU5: '',
				DYSHUJU6: '',
				DYSHUJU7: '',
				DYSHUJU8: '',
				DYSHUJU9: '',
				DYSHUJU10: '',
				DYSHUJU11: '',
				DYSHUJU12: '',
				DYSHUJU13: '',
				DYSHUJU14: '',
				DYSHUJU15: '',
				DYSHUJU16: '',
				DYSHUJU17: '',
				DYSHUJU18: '',
				DYSHUJU19: '',
				DYSHUJU20: '',
				DYSHUJU21: '',
				DYSHUJU22: '',
				DYSHUJU23: '',
				DYSHUJU24: '',
				DYSHUJU25: '',
				DYSHUJU26: '',
				DYSHUJU27: '',
				DYSHUJU28: '',
				DYSHUJU29: '',
				DYSHUJU30: '',
				DYSHUJU31: '',
				DYSHUJU32: '',
				DYSHUJU33: '',
				DY1SHUJU1: '',
				DY1SHUJU2: '',
				DY1SHUJU3: '',
				DY1SHUJU4: '',
				DY1SHUJU5: '',
				DY1SHUJU6: '',
				DY1SHUJU7: '',
				DY1SHUJU8: '',
				DY1SHUJU9: '',
				DY1SHUJU10: '',
				DY1SHUJU11: '',
				DY1SHUJU12: '',

				// MQTT相关
				serve: {
					host: '8.131.85.82',
					wsport: '8083',
					wssport: '443',
					path: '/mqtt',
				},
				//MQTT连接的配置
				options: {
					wsOptions: {},
					protocolVersion: 4, //MQTT连接协议版本
					clientId: uuid(),
					keepalive: 60,
					clean: false,
					reconnectPeriod: 1000, //1000毫秒，两次重新连接之间的间隔
					connectTimeout: 30 * 1000, //1000毫秒，两次重新连接之间的间隔
					resubscribe: true //如果连接断开并重新连接，则会再次自动订阅已订阅的主题（默认true）
				},

}

created() {

			let that = this
			var hosts = ''
			// #ifdef H5
			hosts = 'ws://' + that.serve.host + ':' + that.serve.wsport + that.serve.path
				// #endif
			// // #ifdef MP-WEIXIN
			// hosts = 'wxs://' + this.serve.host + ':' + this.serve.wsport + this.serve.path
			// //#endif
			let client = mqtt.connect(
				hosts,
				that.options
			);
			that.client = client
			client.on('connect', () => {
				console.log("连接成功！");
			});
			// 订阅
			client.subscribe('124', {
			// client.subscribe('trashDataOverflowStatus1/' + 868922051307367, {
				qos: 1
			}, error => {
				if (!error) {
					console.log('订阅成功///');
				}
			})
			client.subscribe('125', {
			// client.subscribe('trashDataOverflowStatus1/' + 868922051307367, {
				qos: 1
			}, error => {
				if (!error) {
					console.log('订阅成功///');
				}
			})
			// client.send('',{
			// 	qos:1
			// })
			client.on('message', (topic, message) => {
				// console.log(1111, topic, )
				let json = JSON.parse(message.toString())
				let data = json.d
				console.log(data)
				if (data.DYSHUJU1 !== undefined) {
				this.DYSHUJU1 = data.DYSHUJU1
				}
				if (data.DYSHUJU2 !== undefined) {
				this.DYSHUJU2 = data.DYSHUJU2
				}
				if (data.DYSHUJU3 !== undefined) {
				this.DYSHUJU3 = data.DYSHUJU3
				}
				if (data.DYSHUJU4 !== undefined) {
				this.DYSHUJU4 = data.DYSHUJU4
				}
				if (data.DYSHUJU5 !== undefined) {
				this.DYSHUJU5 = data.DYSHUJU5
				}
				if (data.DYSHUJU6 !== undefined) {
				this.DYSHUJU6 = data.DYSHUJU6
				}
				if (data.DYSHUJU7 !== undefined) {
				this.DYSHUJU7 = data.DYSHUJU7
				}
				if (data.DYSHUJU8 !== undefined) {
				this.DYSHUJU8 = data.DYSHUJU8
				}
				if (data.DYSHUJU9 !== undefined) {
				this.DYSHUJU9 = data.DYSHUJU9
				}
				if (data.DYSHUJU10 !== undefined) {
				this.DYSHUJU10 = data.DYSHUJU10
				}
				if (data.DYSHUJU11 !== undefined) {
				this.DYSHUJU11 = data.DYSHUJU11
				}
				if (data.DYSHUJU12 !== undefined) {
				this.DYSHUJU12 = data.DYSHUJU12
				}
				if (data.DYSHUJU13 !== undefined) {
				this.DYSHUJU13 = data.DYSHUJU13
				}
				if (data.DYSHUJU14 !== undefined) {
				this.DYSHUJU14 = data.DYSHUJU14
				}
				if (data.DYSHUJU15 !== undefined) {
				this.DYSHUJU15 = data.DYSHUJU15
				}
				if (data.DYSHUJU16 !== undefined) {
				this.DYSHUJU16 = data.DYSHUJU16
				}
				if (data.DYSHUJU17 !== undefined) {
				this.DYSHUJU17 = data.DYSHUJU17
				}
				if (data.DYSHUJU18 !== undefined) {
				this.DYSHUJU18 = data.DYSHUJU18
				}
				if (data.DYSHUJU19 !== undefined) {
				this.DYSHUJU19 = data.DYSHUJU19
				}
				if (data.DYSHUJU20 !== undefined) {
				this.DYSHUJU20 = data.DYSHUJU20
				}
				if (data.DYSHUJU21 !== undefined) {
				this.DYSHUJU21 = data.DYSHUJU21
				}
				if (data.DYSHUJU22 !== undefined) {
				this.DYSHUJU22 = data.DYSHUJU22
				}
				if (data.DYSHUJU23 !== undefined) {
				this.DYSHUJU23 = data.DYSHUJU23
				}
				if (data.DYSHUJU24 !== undefined) {
				this.DYSHUJU24 = data.DYSHUJU24
				}
				if (data.DYSHUJU25 !== undefined) {
				this.DYSHUJU25 = data.DYSHUJU25
				}
				if (data.DYSHUJU26 !== undefined) {
				this.DYSHUJU26 = data.DYSHUJU26
				}
				if (data.DYSHUJU27 !== undefined) {
				this.DYSHUJU27 = data.DYSHUJU27
				}
				if (data.DYSHUJU28 !== undefined) {
				this.DYSHUJU28 = data.DYSHUJU28
				}
				if (data.DYSHUJU29 !== undefined) {
				this.DYSHUJU29 = data.DYSHUJU29
				}
				if (data.DYSHUJU30 !== undefined) {
				this.DYSHUJU30 = data.DYSHUJU30
				}
				if (data.DYSHUJU31 !== undefined) {
				this.DYSHUJU31 = data.DYSHUJU31
				}
				if (data.DYSHUJU32 !== undefined) {
				this.DYSHUJU32 = data.DYSHUJU32
				}
				if (data.DYSHUJU33 !== undefined) {
				this.DYSHUJU33 = data.DYSHUJU33
				}


				if (data.DY1SHUJU1 !== undefined) {
				this.DY1SHUJU1 = data.DY1SHUJU1
				}
				if (data.DY1SHUJU2 !== undefined) {
				this.DY1SHUJU2 = data.DY1SHUJU2
				}
				if (data.DY1SHUJU3 !== undefined) {
				this.DY1SHUJU3 = data.DY1SHUJU3
				}
				if (data.DY1SHUJU4 !== undefined) {
				this.DY1SHUJU4 = data.DY1SHUJU4
				}
				if (data.DY1SHUJU5 !== undefined) {
				this.DY1SHUJU5 = data.DY1SHUJU5
				}
				if (data.DY1SHUJU6 !== undefined) {
				this.DY1SHUJU6 = data.DY1SHUJU6
				}
				if (data.DY1SHUJU7 !== undefined) {
				this.DY1SHUJU7 = data.DY1SHUJU7
				}
				if (data.DY1SHUJU8 !== undefined) {
				this.DY1SHUJU8 = data.DY1SHUJU8
				}
				if (data.DY1SHUJU9 !== undefined) {
				this.DY1SHUJU9 = data.DY1SHUJU9
				}
				if (data.DY1SHUJU10 !== undefined) {
				this.DY1SHUJU10 = data.DY1SHUJU10
				}
				if (data.DY1SHUJU11 !== undefined) {
				this.DY1SHUJU11 = data.DY1SHUJU11
				}
				if (data.DY1SHUJU12 !== undefined) {
				this.DY1SHUJU12 = data.DY1SHUJU12
				}
			})
			client.on('reconnect', error => {
				console.log("正在重连···", error);
			});

			client.on('error', error => {
				console.log("连接失败!", error);
			});


			let url = location.href
		//	url ='http://www.ankaisoft.com/foodstuff/detail.html?id=1494234741958758402&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsZXZlbCI6MCwiaXNzIjoiYXV0aDAiLCJleHAiOjE2NDY4MTQ4MDMsInVzZXJJZCI6IjEifQ.5NLcjj2Ro5RQgWdJRO-SZ1nF7JLE7yVYkiWweZMCSzY'
			let id = url.split('&')[0]
			this.id = id.substring(id.indexOf('=') + 1,id.length)
			let token = url.split('&')[1]
			this.token = token.substring(token.indexOf('=') + 1,token.length)
			axios.get('http://81.70.90.165/fenjiuAPP/room/findById',{
				params: {
					roomId: this.id
				},
				headers: {
					// 'Authorization': 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhdXRoMCIsImV4cCI6MTYzMTY3MzYyNCwidXNlcklkIjoxNDA2NDk4Mzc0NDQ0NjM4MjA5fQ.3vLK47SukIZ0iR_9ayHM6AaG0MS5dp3ReBRO4WOwdCU'
					'Authorization': this.token
				}
			}).then((res) => {
				console.log(res)
				this.info = res.data.data
			}).catch(() => {})
			axios.get('http://81.70.90.165/fenjiuAPP/room/monitorList',{
				params: {
					roomId: this.id
				},
				headers: {
					// 'Authorization': 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhdXRoMCIsImV4cCI6MTYzMTY3MzYyNCwidXNlcklkIjoxNDA2NDk4Mzc0NDQ0NjM4MjA5fQ.3vLK47SukIZ0iR_9ayHM6AaG0MS5dp3ReBRO4WOwdCU'
					'Authorization': this.token
				}
			}).then((res) => {
				console.log(res)
				this.array = res.data.data
				axios.get('http://81.70.90.165/fenjiuAPP/room/findMonitorById',{
					params: {
						monitorId: this.array[0].id,
						width: 318,
						height: 165
					},
					headers: {
						// 'Authorization': 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhdXRoMCIsImV4cCI6MTYzMTY3MzYyNCwidXNlcklkIjoxNDA2NDk4Mzc0NDQ0NjM4MjA5fQ.3vLK47SukIZ0iR_9ayHM6AaG0MS5dp3ReBRO4WOwdCU'
						'Authorization': this.token
					}
				}).then((res) => {
					console.log(res)
					this.url = res.data.data
				}).catch(() => {})
			}).catch(() => {})
		
		},

发布主题


this.client.publish("content", "false", {qos:1}, error => {
					      console.log(error || '消息发布成功'); 
					});
					 console.log(this.client); 
					var that = this
					setTimeout(function(){
						that.isimgopen = true
						that.client.publish("content", "true", {qos:1}, error => {
						      console.log(error || '消息发布成功'); 
						}); 
					},1000)