两种方案使用uniapp开发安卓项目接入MQTT

第一种：使用官方mqtt.js接入

1、安装mqtt.js：npm i mqtt@^3.0    (目前我测试通过的是3.0）

2、使用以下代码引入并运行（我安卓端测试通过的是wss安全协议，所以使用wxs，其它协议可能会报找不到某个对象或构造函数）

<!--
MQTTJS连接，官方MQTTJS插件，支持安卓端和H5端
-->
<template>
	<view class="content">
		<button @click="connect" type="primary">connect</button>
		<button @click="subscribe" type="primary">subscribve</button>
		<button @click="unsubsceibe" type="primary">unsubsceibe</button>
		<button @click="poweron" type="primary">开机研发</button>
		<button @click="poweroff" type="primary">关机研发</button>
		<view class="log">
			<view v-for="(log,index) in logs" class="" :key="index">
				{{log}}
			</view>
		</view>
	</view>
</template>

<script>
	import mqtt from 'mqtt/dist/mqtt.js'
	
	export default {
		data() {
			return {
				mqtt: null,
				logs: []
			}
		},
		methods: {
			async connect() {
				var self = this
				self.logs.push('connect...')

				// #ifdef H5
				this.mqtt = mqtt.connect('wss://mobile.xxx.com.cn:443/wss')
				// #endif
				// #ifdef MP-WEIXIN||APP-PLUS
				console.log("开始手机端mqtt连接。。。")
				this.mqtt = mqtt.connect('wxs://mobile.xxx.com.cn:443/wss')
				// #endif

				let _mqtt = this.mqtt
				this.mqtt.on('connect', function() {
					self.logs.push('on connect')
					// _mqtt.subscribe('presence', function(err) {
					// 	if (!err) {
					// 		_mqtt.publish('presence', 'hello mqtt')
					// 	}
					// })
				}).on('reconnect', function() {
					self.logs.push('on reconnect')
				}).on('error', function() {
					self.logs.push('on error')
				}).on('end', function() {
					self.logs.push('on end')
				}).on('message', function(topic, message) {
					console.log(JSON.parse(message.toString()))
					self.logs.push(message.toString())
				})
			},
			subscribe() {
				this.mqtt.subscribe('okwgt/status/82800')
			},
			unsubsceibe() {
				this.mqtt.unsubsceibe('okwgt/status/82800')
			},
			poweron() {
				this.mqtt.publish('okwgt/ctrl/82800', JSON.stringify({
					"cid": 82800,
					"uuid": 702379,
					"kind": 5,
					"r1": 1
				}), {
					qos: 0,
					retain: false
				}, function(error) {
					if (error) {
						console.log(error)
					} else {
						console.log('Published')
					}
				})
			},
			poweroff() {
				this.mqtt.publish('okwgt/ctrl/82800', JSON.stringify({
					"cid": 82800,
					"uuid": 702379,
					"kind": 5,
					"r1": 0
				}), {
					qos: 0,
					retain: false
				}, function(error) {
					if (error) {
						console.log(error)
					} else {
						console.log('Published')
					}
				})
			}
		}
	}
</script>

注：如果项目需要使用vue3，uniapp市场插件有作者提供了方法，只需将插件中main.js文件替换即可支持，否则会报错，下载地址：mqtt-demo - DCloud 插件市场

第二种：使用uniapp市场插件（mqtt 和 tcp socket - DCloud 插件市场）

1、点击购买离线云打包，选择关联的项目

2、粘贴以下官方代码

<!--
原生MQTT连接，采用Uniapp市场三方插件，仅支持安卓端，不支持H5
-->
<template>
	<view class="page">
		<view class="msg">
			<div v-for="(item,index) in message" :key="index">{{JSON.stringify(item)}}</div>
		</view>
		<view>
			<button @click="message = []">清空屏幕消息</button>
		</view>
		<view>
			TCP
			<button @click="socket('connect')">连接</button>
			<button @click="socket('send')">发消息</button>
			<button @click="socket('close')">关闭连接</button>
			<button @click="socket('isConnected')">是否已连接</button>
		</view>
		<view>
			MQTT
			<button @click="mqtt('connect')">开启连接</button>
			<button @click="mqtt('subscribe')">订阅主题</button>
			<button @click="mqtt('unsubscribe')">取消订阅主题</button>
			<button @click="mqtt('send')">发送数据</button>
			<button @click="mqtt('close')">关闭连接</button>
			<button @click="mqtt('isConnected')">是否已连接</button>
		</view>
	</view>
</template>

<script>
	const _TCPSocket = uni.requireNativePlugin("zad-socket-tcp");
	const _MQTT = uni.requireNativePlugin("zad-socket-mqtt");
	export default {
		data() {
			return {
				message: [{
					code: 200,
					data: 'Socket 插件测试'
				}]
			}
		},
		onLoad() {},
		methods: {
			socket(method) {
				switch (method) {
					case "connect": //连接
						_TCPSocket.event({
							method: method,
							param: {
								ip: '192.168.10.21',
								port: 6000
							}
						}, e => {
							this.handleMessage(e)
						})
						break;
					case "isConnected": //是否已连接
						_TCPSocket.event({
							method: 'isConnected'
						})
						break;
					case "send": //发送消息
						_TCPSocket.event({
							method: 'send',
							param: {
								message: '消息1'
							}
						})
						break;
					case "close": //关闭
						_TCPSocket.event({
							method: 'close'
						})
						break;
				}
			},
			mqtt(method, param) {
				switch (method) {
					case "connect": //连接
						_MQTT.event({
							method: 'connect',
							param: {
								url: 'tcp://mobile.xxx.com.cn:1883',
								username: 'admin',
								password: 'public',
								clientId: 'abcd123'
							}
						}, e => {
							console.log("receive", e)
							this.handleMessage(e)
						})
						break;
					case "isConnected": //是否已连接
						_MQTT.event({
							method: 'isConnected'
						})
						break;
					case "subscribe": //订阅
						_MQTT.event({
							method: 'subscribe',
							param: {
								topic: 'okwgt/status/82800'
							}
						})
						break;
					case "unsubscribe": //取消订阅
						_MQTT.event({
							method: 'unsubscribe',
							param: {
								topic: 'okwgt/status/82800'
							}
						})
						break;
					case "send": //发送消息
						_MQTT.event({
							method: 'send',
							param: {
								topic: 'okwgt/ctrl/82800',
								message: '{"cid": "82800","type": "all"}'
							}
						})
						break;
					case "close": //关闭
						_MQTT.event({
							method: 'close'
						})
						break;
				}
			},
			handleMessage(e) {
				//e.code    400方法调用失败、200方法调用成功、0插件主动发送的消息、-1插件主动发送的异常消息
				//e.method  调用时传递的参数，可以根据method处理逻辑
				//e.data    返回数据体
				this.message.push(e)
				if (e.method == 'receive') {
					//接收到服务端的消息
					console.log(e.data)
				}
			},
		}
	}
</script>

3、使用HbuilderX制作自定义基座（因为该插件使用了原生接口，官方基座无此功能，因此需要生成自定义基座），为了让基座支持以下的两个引用

const _TCPSocket = uni.requireNativePlugin("zad-socket-tcp");
const _MQTT = uni.requireNativePlugin("zad-socket-mqtt");

制作自定义基座：

注意Android包名必须和购买离线云打包时的包名一致

提示制作完成后，用数据线连接android设备，然后运行项目：（如果发生无法连接或发现，可以打开设备端的开发者模式，具体步骤这里不详述）