#使用mpvue 开发小程序过程中 简单介绍一下微信小程序蓝牙连接过程
#在蓝牙连接的过程中部分api需要加定时器延时1秒到2秒左右再执行,原因为何不知道,小程序有这样的要求
#1首先是要初始化蓝牙:openBluetoothAdapter()
```js
if (wxopenBluetoothAdapter) {
wxopenBluetoothAdapter({
success: function(res) {
/ 获取本机的蓝牙状态 /
setTimeout(() => {
getBluetoothAdapterState()
}, 1000)
},
fail: function(err) {
// 初始化失败
}
})
} else {
}
```
#2检测本机蓝牙是否可用:
# 要在上述的初始化蓝牙成功之后回调里调用
```js
getBluetoothAdapterState() {
var that= this;
thattoastTitle= '检查蓝牙状态'
wxgetBluetoothAdapterState({
success: function(res) {
startBluetoothDevicesDiscovery()
},
fail(res) {
consolelog(res)
}
})
}
```
#3 开始搜索蓝牙设备:
```js
startBluetoothDevicesDiscovery() {
var that= this;
setTimeout(() => {
wxstartBluetoothDevicesDiscovery({
success: function(res) {
/ 获取蓝牙设备列表 /
thatgetBluetoothDevices()
},
fail(res) {
}
})
}, 1000)
}
```
#4 获取搜索到的蓝牙设备列表
# / thatdeviceName 是获取到的蓝牙设备的名称, 因为蓝牙设备在安卓和苹果手机上搜到的蓝牙地址显示是不一样的,所以根据设备名称匹配蓝牙/
```js
getBluetoothDevices() {
var that= this;
setTimeout(() => {
wxgetBluetoothDevices({
services: [],
allowDuplicatesKey: false,
interval: 0,
success: function(res) {
if (resdeviceslength> 0) {
if (JSONstringify(resdevices)indexOf(thatdeviceName) !== -1) {
for (let i = 0; i < resdeviceslength; i++) {
if (thatdeviceName === resdevices[i]name) {
/ 根据指定的蓝牙设备名称匹配到deviceId /
thatdeviceId = thatdevices[i]deviceId;
setTimeout(() => {
thatconnectTO();
}, 2000);
};
};
} else {
}
} else {
}
},
fail(res) {
consolelog(res, '获取蓝牙设备列表失败=====')
}
})
}, 2000)
},
```
#5连接蓝牙
# 匹配到的蓝牙设备ID 发送连接蓝牙的请求, 连接成功之后 应该断开蓝牙搜索的api,然后去获取所连接蓝牙设备的service服务
```js
connectTO() {
wxcreateBLEConnection({
deviceId: deviceId,
success: function(res) {
thatconnectedDeviceId = deviceId;
/ 4获取连接设备的service服务 /
thatgetBLEDeviceServices();
wxstopBluetoothDevicesDiscovery({
success: function(res) {
consolelog(res, '停止搜索')
},
fail(res) {
}
})
},
fail: function(res) {
}
})
}
```
#6 获取蓝牙设备的service服务,获取的serviceId有多个要试着连接最终确定哪个是稳定版本的service 获取服务完后获取设备特征值
```js
getBLEDeviceServices() {
setTimeout(() => {
wxgetBLEDeviceServices({
deviceId: thatconnectedDeviceId,
success: function(res) {
thatservices= resservices
/ 获取连接设备的所有特征值 /
thatgetBLEDeviceCharacteristics()
},
fail: (res) => {
}
})
}, 2000)
},
```
#7获取蓝牙设备特征值
# 获取到的特征值有多个,最后要用的事能读,能写,能监听的那个值的uuid作为特征值id,
```js
getBLEDeviceCharacteristics() {
setTimeout(() => {
wxgetBLEDeviceCharacteristics({
deviceId: connectedDeviceId,
serviceId: services[2]uuid,
success: function(res) {
for (var i = 0; i < rescharacteristicslength; i++) {
if ((rescharacteristics[i]propertiesnotify || rescharacteristics[i]propertiesindicate) &&
(rescharacteristics[i]propertiesread && rescharacteristics[i]propertieswrite)) {
consolelog(rescharacteristics[i]uuid, '蓝牙特征值 ==========')
/ 获取蓝牙特征值 /
thatnotifyCharacteristicsId = rescharacteristics[i]uuid
// 启用低功耗蓝牙设备特征值变化时的 notify 功能
thatnotifyBLECharacteristicValueChange()
}
}
},
fail: function(res) {
}
})
}, 1000)
},
```
#8启动notify 蓝牙监听功能 然后使用 wxonBLECharacteristicValueChange用来监听蓝牙设备传递数据
#接收到的数据和发送的数据必须是二级制数据, 页面展示的时候需要进行转换
```js
notifyBLECharacteristicValueChange() { // 启用低功耗蓝牙设备特征值变化时的 notify 功能
var that= this;
consolelog('6启用低功耗蓝牙设备特征值变化时的 notify 功能')
wxnotifyBLECharacteristicValueChange({
state: true,
deviceId: thatconnectedDeviceId,
serviceId: thatnotifyServicweId,
characteristicId: thatnotifyCharacteristicsId,
complete(res) {
/用来监听手机蓝牙设备的数据变化/
wxonBLECharacteristicValueChange(function(res) {
//
thatbalanceData += thatbuf2string(resvalue)
thathexstr += thatreceiveData(resvalue)
})
},
fail(res) {
consolelog(res, '启用低功耗蓝牙设备监听失败')
thatmeasuringTip(res)
}
})
},
/转换成需要的格式/
buf2string(buffer) {
var arr = Arrayprototypemapcall(new Uint8Array(buffer), x => x)
return arrmap((char, i) => {
return StringfromCharCode(char);
})join('');
},
receiveData(buf) {
return thishexCharCodeToStr(thisab2hex(buf))
},
/转成二进制/
ab2hex (buffer) {
var hexArr = Arrayprototypemapcall(
new Uint8Array(buffer), function (bit) {
return ('00' + bittoString(16))slice(-2)
}
)
return hexArrjoin('')
},
/转成可展会的文字/
hexCharCodeToStr(hexCharCodeStr) {
var trimedStr = hexCharCodeStrtrim();
var rawStr = trimedStrsubstr(0, 2)toLowerCase() === '0x' trimedStrsubstr(2) : trimedStr;
var len = rawStrlength;
var curCharCode;
var resultStr= [];
for (var i = 0; i < len; i = i+ 2) {
curCharCode = parseInt(rawStrsubstr(i, 2), 16);
resultStrpush(StringfromCharCode(curCharCode));
}
return resultStrjoin('');
},
```
# 向蓝牙设备发送数据
```js
sendData(str) {
let that= this;
let dataBuffer = new ArrayBuffer(strlength)
let dataView = new DataView(dataBuffer)
for (var i = 0; i < strlength; i++) {
dataViewsetUint8(i, strcharAt(i)charCodeAt())
}
let dataHex = thatab2hex(dataBuffer);
thiswriteDatas = thathexCharCodeToStr(dataHex);
wxwriteBLECharacteristicValue({
deviceId: thatconnectedDeviceId,
serviceId: thatnotifyServicweId,
characteristicId: thatnotifyCharacteristicsId,
value: dataBuffer,
success: function (res) {
consolelog('发送的数据:' + thatwriteDatas)
consolelog('message发送成功')
},
fail: function (res) {
},
complete: function (res) {
}
})
},
```
# 当不需要连接蓝牙了后就要关闭蓝牙,并关闭蓝牙模块
```js
// 断开设备连接
closeConnect() {
if (thatconnectedDeviceId) {
wxcloseBLEConnection({
deviceId: thatconnectedDeviceId,
success: function(res) {
thatcloseBluetoothAdapter()
},
fail(res) {
}
})
} else {
thatcloseBluetoothAdapter()
}
},
// 关闭蓝牙模块
closeBluetoothAdapter() {
wxcloseBluetoothAdapter({
success: function(res) {
},
fail: function(err) {
}
})
},
```
#在向蓝牙设备传递数据和接收数据的过程中,并未使用到read的API 不知道有没有潜在的问题,目前线上运行为发现任何的问题
#今天的蓝牙使用心得到此结束,谢谢
1,只能bindtap点击事件或者发起支付回调后才能触发,bindsubmit发送表单不行,不过现在的订阅消息已经不需要formid,所以改起来挺容易的
2,wxrequestSubscribeMessage里的success(res){} fail(res){} 并不是分别点击确定取消触发的回调,而是wxrequestSubscribeMessage调用成功和失败的回调,一般在fail里可以打印下错误msg,还有个complete(res){}是调用成功失败后都会触发的回调
3,只支持基础库282以上,所以如果你有事件是放在success或者complete回调里调用,需要向下兼容,判断用户的基础库版本,注意,这个错误不会走调用失败fail的回调 而是编译器直接报错no function
wxgetSystemInfo({
success: function (res) {
var version = resSDKVersion;
version = versionreplace(/\/g, "")
consolelog(version)
if (parseInt(version) >= 282){
wxrequestSubscribeMessage({
success(res){
do something
}
})
}
else{
do something
}
4,点击下方"总保持以上选择,不再询问"后 貌似清了缓存也再也不出来提示框貌似是这样 但是success fail complete回调里的事件还会触发只是不再d出提示框
先暂时这些
这个问题遇到多次了,很多人单看这句话提示,会去检查自己的微信版本,其实这个跟微信版本没有关系,这是微信小程序的基础库版本过高造成的。
去小程序的开发后台设置这里更改一下版本库到2212, 亲测这个版本pc是可以打开微信小程序的。
但是这里会有一个bug,就是,微信最近不是回收了这个权限吗, wxgetUserProfile({
desc: “获取你的昵称、头像、地区及性别”,
success: res => {}})
就是微信后台不会再给我们返回用户头像 昵称了。 改造了一下,让用户主动触发去上传头像,昵称。
<button open-type="chooseAvatar" bindchooseavatar="onChooseAvatar" style="width: 200rpx;padding: 0;margin: 0 auto;">
1
1
点击,可更改 点击更新 onChooseAvatar(e) { consolelog(e) const { avatarUrl } = edetail wxgetFileSystemManager()readFile({ filePath: edetailavatarUrl , //选择返回的相对路径 encoding: 'base64', //编码格式 success: res => { //成功的回调 // consolelog('data:image/png;base64,' + resdata) thissetData({ base64img:'data:image/png;base64,' + resdata }) } }) thissetData({ avatarUrl, }) wxsetStorageSync('img', edetailavatarUrl ) }, handleusername(e){ consolelog(e) thissetData({ username: edetailvalue }) wxsetStorageSync('username', edetailvalue ) },
这有涉及到另一个问题,因为 open-type=“chooseAvatar” pc端也有最低版本库要求,2245,(当初这里还折磨了我很久,我当时用的版本库是2212,手机能获取头像,但是pc死活不能,后来在社区交流发现是版本库的设置问题。 所以记录一下走过的坑吧~~)
这就很尴尬了,我为了获取头像,那么我得升级版本库。但是为了pc端能打开小程序,我又得降级版本库。。。 那么取其一,还是降级为2212了。 小程序获取头像在真机上获取吧。
因为对小程序父标签和子标签的布局还不是特别了解,不像ios,父标签固定,子标签通过mansory去布局距离父的底部多少即可。小程序的我能想到的就是动态算出每一个标签的高度,然后总高度减掉就是想得到的子标签的高度了。如果有哪位大神可以指导一二,感激不尽~~~
<view id='viewID'>
<view id="scriptID">
var query = wxcreateSelectorQuery();
//选择id
queryselect('#numID')boundingClientRect()
queryselect('#scriptID')boundingClientRect()
queryexec(function (res) {
//res就是 所有标签为mjltest的元素的信息 的数组
consolelog('所有:',res);
//取高度
thatsetData({
storyHeight:thatdatadetailHeight -(res[0]height+res[1]height)
})
});
var requestHandler = {
params: {},
api: '',
type: '',
success: function (res) {
},
fail: function () {
},
}
//GET请求
function GET(requestHandler) {
request('GET', requestHandler)
}
//POST请求
function POST(requestHandler) {
request('POST', requestHandler)
}
function request(method, requestHandler) {
//注意:可以对params加密等处理
var params = requestHandlerparams;
// paramstoken = wxgetStorageSync('token'); 这里可以写每次请求都必带的参数
var api = requestHandlerapi;
wxrequest({
url: API_URL + api,
data: params,
method: method,
header: {
'Content-Type': 'application/x->
微信小程序怎么实现蓝牙连接?(代码示例)
微信小程序 2022-03-13
微信小程序如何实现蓝牙连接?本篇文章给大家带来的内容是介绍微信小程序实现蓝牙连接的方法(步骤)。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。
最近的项目需要使用小程序的蓝牙功能与硬件设备进行连接相互传送数据指令,联调过程中发现一些问题,于是想着记录下来,方便以后查看!
1、初始化蓝牙设备
一般使用蓝牙功能肯定是想连接某一个蓝牙设备,所以需要知道这个蓝牙设备的名称,一般来说都是扫描二维码连接,那么当你扫描这个设备二维码的时候,就需要去初始化你手机上的蓝牙模块了
/
初始化蓝牙设备
/
initBlue:function(){
var that = this;
wxopenBluetoothAdapter({//调用微信小程序api 打开蓝牙适配器接口
success: function (res) {
// consolelog(res)
wxshowToast({
title: '初始化成功',
icon: 'success',
duration: 800
})
thatfindBlue();//20
},
fail: function (res) {//如果手机上的蓝牙没有打开,可以提醒用户
wxshowToast({
title: '请开启蓝牙',
icon: 'fails',
duration: 1000
})
}
})
},
2、搜索蓝牙设备
手机蓝牙初始化成功之后,就会去搜索周边的蓝牙设备
/
开始搜索蓝牙设备
/
findBlue(){
var that = this
wxstartBluetoothDevicesdiscovery({
allowDuplicatesKey: false,
interval: 0,
success: function (res) {
以上就是关于微信小程序蓝牙教程--完整版亲测全部的内容,包括:微信小程序蓝牙教程--完整版亲测、微信小程序订阅消息wx.requestSubscribeMessage需要注意的几个地方、微信小程序突然版本就变了等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)