uniapp 小程序 蓝牙

已于 2023-11-13 13:16:09 修改
阅读量80 收藏
点赞数 1
分类专栏： 小程序 uniapp 蓝牙 文章标签： uni-app 小程序 javascript
于 2023-11-13 13:11:18 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45096326/article/details/134374788
版权
小程序 同时被 3 个专栏收录
1 篇文章 0 订阅
订阅专栏
uniapp
1 篇文章 0 订阅
订阅专栏
蓝牙
1 篇文章 0 订阅
订阅专栏
  1. 创建 bluetooth.js 文件
function ble_com(readCallBack, statusCallBack) {
	this.readCallBack = readCallBack;
	this.statusCallBack = statusCallBack;
	this.characteristicObj = {
		read: '',
		write: '',
		notify: ''
	}
	this.writeserveObjUuid = ''
	this.readServerObjUuid = ''
	this.characteristics = ''
	this.waiweiId = ''
	this.advertisData = ''
	this.asciiRes = ''
	this.asciiCode = ''
	this.asciiSuc = ''
	this.asciiStep = ''
	this.asciiHex = ''
	this.instruct = ''
	this.blueToothconnected = ''
	this.readVal = ''
	this.writeState = false
	this.callBackState = false
}
ble_com.prototype = {
	onLoad: function(tableNumber) {
		//在页面加载时候初始化蓝牙适配器
		uni.openBluetoothAdapter({
			success: (e) => {
				uni.showLoading({
					title: '连接中',
					mask: true
				});
				// 初始化完毕开始搜索
				this.startBluetoothDeviceDiscovery(tableNumber)
			},
			fail: res => {
				uni.showToast({
					icon: "none",
					title: "请检查蓝牙是否开启！",
					duration: 2000
				})
			}
		});
		this.onBLEConnectionStateChange()
	},

	// 初始化完毕开始搜索
	startBluetoothDeviceDiscovery: function(tableNumber) {
		//在页面显示的时候判断是都已经初始化完成蓝牙适配器若成功，则开始查找设备
		uni.startBluetoothDevicesDiscovery({
			success: res => {
				this.onBluetoothDeviceFound(tableNumber);
			},
			fail: res => {
				uni.showToast({
					icon: "none",
					title: "查找设备失败！",
					duration: 3000
				})
			}
		});
	},
	ab2hex: function(buffer) {
		const hexArr = Array.prototype.map.call(
			new Uint8Array(buffer),
			function(bit) {
				return ('00' + bit.toString(16)).slice(-2)
			}
		)
		return hexArr.join('')
	},
	// 发现外围设备
	onBluetoothDeviceFound: function(tableNumber) {
		uni.onBluetoothDeviceFound(devices => {
			if (devices.devices[0].localName) {
				if (devices.devices[0].localName.indexOf('JNM-' + tableNumber) != -1 && devices
					.devices[0].advertisData) {
					this.advertisData = this.ab2hex(devices.devices[0].advertisData)
					this.stopBluetoothDevicesDiscovery();
					this.waiweiId = devices.devices[0].deviceId
					this.createBLEConnection(devices.devices[0].deviceId)
					return;
				}
			}
		});
	},
	//停止搜索蓝牙设备
	stopBluetoothDevicesDiscovery: function() {
		uni.stopBluetoothDevicesDiscovery({
			success: e => {
				console.log('停止搜索蓝牙设备:' + e.errMsg);
			},
			fail: e => {
				console.log('停止搜索蓝牙设备失败，错误码：' + e.errCode);
			}
		});
	},
	//断开蓝牙连接
	closeBLEConnection: function() {
		uni.closeBLEConnection({
			deviceId: this.waiweiId,
			success: res => {}
		})
	},

	createBLEConnection: function(deviceId) {
		uni.createBLEConnection({
			deviceId: deviceId,
			success: res => {
				this.stopBluetoothDevicesDiscovery();
				this.getBLEDeviceServices(deviceId);
			},
			fail: res => {
				console.log(res)
			}
		})
	},

	getBLEDeviceServices: function(deviceId) {
		setTimeout(() => {
			uni.getBLEDeviceServices({
				// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
				deviceId: deviceId,
				success: (res) => {
					this.writeState = false
					console.log(res, '126');
					res.services.forEach(item => {
						this.getBLEDeviceCharacteristics(deviceId, item.uuid)
					})
				}
			})
		}, 1000)
	},

	getBLEDeviceCharacteristics: function(deviceId, serviceId) {
		setTimeout(() => {
			uni.getBLEDeviceCharacteristics({
				// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
				deviceId: deviceId,
				// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
				serviceId: serviceId,
				success: (res) => {
					let state = 0
					console.log(res, '129');
					this.characteristics = res.characteristics
					res.characteristics.forEach(item => {
						if (item.properties.read) {
							this.characteristicObj.read = item.uuid
							this.readServerObjUuid = serviceId
							this.readBLECharacteristicValue(deviceId, serviceId,
								item.uuid
							);
						}
						if (item.properties.write && !this.writeState) {
							this.characteristicObj.write = item.uuid
							this.writeserveObjUuid = serviceId
							this.writeState = true
						}

						if (item.properties.notify && state === 0) {
							this.characteristicObj.notify = serviceId
							state = 1
							this.notifyBLECharacteristicValueChange(deviceId, item
								.uuid, serviceId)

						}

					})

				},
				fail: (res) => {
					console.log(res, '153')
				}
			})
		}, 2000)
	},
	readBLECharacteristicValue: function(deviceId, serviceId, characteristicId) {
		uni.readBLECharacteristicValue({
			deviceId: deviceId,
			serviceId: serviceId,
			characteristicId: characteristicId,
			success: (res) => {
				console.log(res, '167');
			},
			fail: (res) => {
				console.log(res, '170');
			}
		})
	},
	// 启用 notify 功能
	notifyBLECharacteristicValueChange: function(deviceId, characteristicId, serviceId) {
		uni.notifyBLECharacteristicValueChange({
			state: true, // 启用 notify 功能
			// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
			deviceId: deviceId,
			// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
			serviceId: serviceId,
			// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
			characteristicId: characteristicId,
			success: (res) => {
				uni.hideLoading();
				console.log('初始化完成');
				this.onBLECharacteristicValueChange(deviceId);
			},
			fail: (res) => {
				console.log('notifyBLECharacteristicValueChange success', res.errMsg)
			}
		})
	},
	//蓝牙连接状态回调
	onBLEConnectionStateChange: function() {
		uni.onBLEConnectionStateChange((res) => {
			this.statusCallBack({
				advertisData: this.advertisData,
				connected: res.connected
			})
			if (res.connected) {
				uni.hideLoading();
				uni.showToast({
					title: '连接成功！等待初始化！',
					duration: 2000
				});
				uni.showLoading({
					title: '初始化中 请等待',
					mask: true
				});
			} else {

				// uni.showToast({
				// 	title: '蓝牙已断开！',
				// 	icon: "none",
				// 	duration: 2000
				// });
			}
		})
	},

	//回调
	onBLECharacteristicValueChange: function(deviceId) {
		uni.onBLECharacteristicValueChange((res) => {
			this.callBackState = true
			let hex = this.ab2hex(res.value)
			this.readVal += hex;
			console.log(this.readVal, '232');
			//测试
			if (this.instruct === 'writeTable') {
				this.readCallBack({
					data: this.readVal,
					cmd: this.instruct,
				})
			} else {
				this.readCallBack({
					data: this.readVal,
					cmd: 'connectState',
				})
			}
		})

	},

	ab2hex: function(buffer) {
		const hexArr = Array.prototype.map.call(
			new Uint8Array(buffer),
			function(bit) {
				return ('00' + bit.toString(16)).slice(-2)
			}
		)
		return hexArr.join('')
	},
	/**
	 * @param {Object} value
	 */
	writeBLECharacteristicValue: function(value) {
		let buffer = this.stringToBytes(value)
		uni.writeBLECharacteristicValue({
			// 这里的 deviceId 需要在 getBluetoothDevices 或 onBluetoothDeviceFound 接口中获取
			deviceId: this.waiweiId,
			writeType: 'write',
			// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
			serviceId: this.writeserveObjUuid,
			// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
			characteristicId: this.characteristicObj.write,
			// 这里的value是ArrayBuffer类型
			value: buffer,
			success: (res) => {
				console.log('writeBLECharacteristicValue success', res)
			},
			fail: (res) => {
				console.log('writeBLECharacteristicValue success', res)
			}
		})
	},
	//批次写入
	multipleWriteBLECharacteristicValue: function(values) {
		console.log(values);
		values.forEach(item => {
			let buffer = this.stringToBytes(item)
			uni.writeBLECharacteristicValue({
				// 这里的 deviceId 需要在 getBluetoothDevices 或 onBluetoothDeviceFound 接口中获取
				deviceId: this.waiweiId,
				writeType: 'writeNoResponse',
				// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
				serviceId: this.writeserveObjUuid,
				// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
				characteristicId: this.characteristicObj.write,
				// 这里的value是ArrayBuffer类型
				value: buffer,
				success: (res) => {
					console.log('writeBLECharacteristicValue success', res)
				},
				fail: (res) => {
					console.log('writeBLECharacteristicValue success', res)
				}
			})
		})
	},
	/**
	 * @param {Object} hex
	 */
	stringToBytes: function(hex) {
		var typedArray = new Uint8Array(hex.match(/[\da-f]{2}/gi).map(function(h) {
			return parseInt(h, 16)
		}))
		return typedArray.buffer
	},
	writeTable: function(data) {
		console.log(data);
		this.resetState()
		this.instruct = 'writeTable'
		this.writeBLECharacteristicValue(data)
	},
	xorSum: function(hex) {
		var sum = 0;
		for (var i = 0; i < hex.length / 2; i++) {
			if (i == 0) {
				sum = parseInt(hex.substr(i * 2, 2), 16);
			} else {
				sum ^= parseInt(hex.substr(i * 2, 2), 16);
			}
		}
		var sumHex = sum.toString(16)
		if (sumHex.length < 2) {
			sumHex = '0' + sumHex;
		}
		return sumHex.toUpperCase();
	},
	hex2ascii: function(hex) {
		let str = '';
		for (let i = 0; i < hex.length / 2; i++) {
			str += String.fromCharCode(parseInt(hex.substr(i * 2, 2), 16));
		}
		return str;
	},
	resetState: function() {
		this.asciiRes = ''
		this.asciiCode = ''
		this.asciiSuc = ''
		this.asciiStep = ''
		this.asciiHex = ''
		this.callBackState = false;
	}
}

export default {
	ble_com
}
  1. 在main.js 添加
import {
	createSSRApp
} from "vue";
import App from "./App.vue";
import uviewPlus from 'uview-plus'
import bluetooth from '@/utils/bluetooth.js'
export function createApp() {
	const app = createSSRApp(App);
	var ble_com = new bluetooth.ble_com((e) => {}, (e) => {})
	app.config.globalProperties.$global = {
		bleCom: ble_com
	}
	app.use(uviewPlus)
	// 需要在app.use(uview-plus)之后执行
	uni.$u.setConfig({
		// 修改$u.config对象的属性
		config: {
			// 修改默认单位为rpx，相当于执行 uni.$u.config.unit = 'rpx'
			unit: 'rpx'
		},
		// 修改$u.props对象的属性
		props: {
			// 修改radio组件的size参数的默认值，相当于执行 uni.$u.props.radio.size = 30
			radio: {
				size: 15
			}
			// 其他组件属性配置
			// ......
		}
	})
	return {
		app,
	};
}
  1. 在vue 页面使用
	data() {
			return {
				searchForm: {
					meterNo: "",
					notifyData: "",
					areaCode: "",
				}
			};
		},
	onLoad() {
			let _this = this
			this.proxy = getCurrentInstance().proxy
			this.proxy.$global.bleCom.readCallBack = (res) => {
				if (res.cmd === 'connectState') {
					_this.searchForm.notifyData = res.data
				}
				if (res.cmd === 'writeTable') {
					_this.onCallBack(res.data)
				}
			}
			this.proxy.$global.bleCom.statusCallBack = (res) => {
				if (uni.getSystemInfoSync().platform === 'ios') {
					_this.searchForm.notifyData = res.advertisData
				}
				if (res.connected) {
					// 成功之后的业务需求 
					// _this.onSubmit()
				}
			}
		},
  1. 注意：安卓与ios的 notifyData 值是不同方法取的 原因自行百度
//安卓  通过onBLECharacteristicValueChange 回调获取 在bluebooth.js文件找
//ios  在蓝牙成功时就能获取一个advertisData 通过this.ab2hex(devices.devices[0].advertisData)转换
	ab2hex: function(buffer) {
		const hexArr = Array.prototype.map.call(
			new Uint8Array(buffer),
			function(bit) {
				return ('00' + bit.toString(16)).slice(-2)
			}
		)
		return hexArr.join('')
	},
小白•
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
uniapp 小程序低功耗蓝牙配网 ble配网 物联网
future_1_的博客
05-08 494
uniapp 小程序低功耗蓝牙配网 ble配网 物联网
uniapp链接蓝牙小程序
03-25
uniapp链接蓝牙小程序(可发送和接收消息)
uniapp实现蓝牙通信
qq_46639390的博客
03-04 1818
uniapp蓝牙通信
uniapp开发app中蓝牙设备功能详细步骤
最新发布
2301_81431930的博客
08-05 472
uniapp开发应用中使用蓝牙设备时，正确的蓝牙设备初始化、搜索、连接和数据交互过程。
uni-app 蓝牙传输
yanhhillo的博客
07-11 617
最近在做一个项目，要求app通过蓝牙连接设备并将报文传输至设备中，在这个过程踩过了几个坑，总结如下：根据uni-app官网API主要涉及到“蓝牙”和“低功耗蓝牙”两个部分。
uni-app微信小程序如何开发蓝牙功能
您的博客
11-14 2840
uni-app小程序中开发蓝牙功能，uni-app微信小程序对接蓝牙功能，微信小程序开发蓝牙功能，支付宝小程序开发蓝牙功能。
uni-app 小程序蓝牙基础
qq_39542702的博客
07-05 2341
本文介绍了uni-app蓝牙的基本调用，如搜索蓝牙设备，链接蓝牙设备，给蓝牙设备发送值，接收蓝牙设备传值
我的练习，uniapp小程序蓝牙使用
03-01
我的练习，uniapp小程序蓝牙使用
uniapp小程序蓝牙打印机二维码.zip
09-30
标题 "uniapp小程序蓝牙打印机二维码.zip" 暗示了这个压缩包包含了一个使用uniapp框架开发的小程序项目，其核心功能是通过蓝牙连接到打印机并打印二维码。uniapp是一个跨平台的前端开发框架，它允许开发者用一套代码...
uniapp蓝牙封装.zip
07-17
通过vuex的集成，可以实现应用程序状态的统一管理和跨组件通信，使得蓝牙打印功能在整个应用中的调用变得简单且高效。用户只需提供要打印的数据，无需关心底层的蓝牙连接和打印细节，也无需额外安装其他依赖包，提高...
download (2)_uniapp蓝牙打印_
10-02
`uniapp`是一个基于Vue.js开发的多端框架，它允许开发者使用一套代码编写应用，然后发布到iOS、Android、Web（H5）、微信小程序等多个平台。而`蓝牙打印`则是物联网技术的一个应用场景，尤其在零售、餐饮等需要即时...
uni-app使用蓝牙
lw18751836671的专栏
01-09 6489
原因是公司要搞个共享单车给内部员工使用，所以需要用手机连接锁蓝牙，然后扫码开锁。这个时候就要看看uni-app的蓝牙模块了。uni-app的蓝牙模块看起来只支持低功耗蓝牙，即ble蓝牙。然后公司就找了个厂商，这个厂商就给了我一份文档，如下图所示，这份文档呢有一些指令，指令如下图，可以看到这些指令呢都是一些16进制的数据，即发送给蓝牙的数据为，0xfe 0x66 0x00 0x21 0x00 （app-车锁的模块）最后的CRC是将前面的数据加密。最后车锁会返回给APP数据，即 车锁-app模块。
uni-app蓝牙操作
qq_35323539的博客
09-02 9977
uni-app和硬件的蓝牙交互操作
uniapp微信小程序蓝牙连接与设备数据对接
weixin_44242600的博客
10-07 3293
蓝牙连接并通信方法封装大致步骤。
uniapp 与蓝牙设备收发指令详细步骤(完整项目版)
qq_42349944的博客
11-24 4545
阅读前须知：1、若已知蓝牙设备的 deviceId、serviceId、以及读写特征值，可以直接从第7点开始阅读3、与蓝牙设备之间收发数据格式必须为 ArrayBuffer4、本文中与蓝牙设备收发数据时，数据包的长度为20 字节，不够 20 字节的补 0。
uni-app实现跨端开发手机蓝牙接收和发送数据
CodingNoob
07-27 7144
uni-app实现跨端开发手机蓝牙接收和发送数据
uniapp设备连接蓝牙并发送数据
m0_74170441的博客
03-22 696
以上代码拿去用就行了。
uniapp通过蓝牙传输数据 （安卓）
一个努力不被优化的程序员
04-02 1391
在"uni-bluetooth"目录下创建一个"www"目录，然后在该目录下创建一个用于存放插件JS代码的目录，比如"js"。在"js"目录中，创建一个新的JS文件，比如"index.js"，并在其中定义插件的JS接口方法，如搜索蓝牙设备、连接蓝牙设备、发送数据等。然后在该目录下创建一个"Android"目录，并在该目录下创建一个用于存放Java代码的目录，比如"src/main/java/com/uni/bluetooth"。在uni-app中，可以通过原生插件的方式来实现蓝牙传输数据的功能。
微信小程序蓝牙连接 uniApp蓝牙连接设备
weixin_47756693的博客
11-22 1542
微信小程序蓝牙连接设备，uniApp蓝牙连接设备
uniapp 小程序 蓝牙4.0
06-08
Uniapp 可以通过 uni-ble 插件实现蓝牙 4.0 功能，该插件支持 Android 和 iOS 平台。你可以在 uni-app 官网上了解更多关于 uni-...如果你需要更详细的蓝牙 4.0 开发指南，可以参考微信小程序官方文档中的蓝牙接口部分。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值