微信小程序连接已发现的蓝牙设备(createBLEConnection)

2018年08月14日 08:26 | 462次浏览 作者原创 版权保护

上一章节已经介绍了微信小程序发现周边蓝牙设备并且获取到周边蓝牙设备,包括设备的UUID,name等设备信息,本章节将主要介绍连接蓝牙设备。首先咱们看看官方文档说明:


wx.createBLEConnection(OBJECT)

连接低功耗蓝牙设备。

若小程序在之前已有搜索过某个蓝牙设备,并成功建立链接,可直接传入之前搜索获取的deviceId直接尝试连接该设备,无需进行搜索操作。


OBJECT参数说明:

参数类型必填说明
deviceIdString蓝牙设备 id,参考 getDevices 接口
timeoutNumber超时时间,单位ms,不填表示不会超时
successFunction成功则返回本机蓝牙适配器状态
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数:

参数类型说明
errMsgString成功:ok,错误:详细信息

示例代码:

wx.createBLEConnection({
  // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 
  deviceId: deviceId,
  success: function (res) {
    console.log(res)
  }
})


Bug & Tip

1、tip: 安卓手机上如果多次调用create创建连接,有可能导致系统持有同一设备多个连接的实例,导致调用close的时候并不能真正的断开与设备的连接。因此请保证尽量成对的调用create和close接口

2、tip: 蓝牙链接随时可能断开,建议监听 wx.onBLEConnectionStateChange 回调事件,当蓝牙设备断开时按需执行重连操作

3、tip: 若对未连接的设备或已断开连接的设备调用数据读写操作的接口,会返回10006错误,详见错误码,建议进行重连操作


根据官方文档编写实现代码

1,打开微信小程序开发工具,编写lanya.wxml  实际上此页面类似于html页面一样,代码如下

<view class="content">
<view>日志信息:
<textarea style='border:1px solid #ccc'>
{{msg}}
</textarea>
</view>

<button type="primary" class="button" bindtap="lanya1">1初始化蓝牙适配器</button>
<button type="primary" class="button" bindtap="lanya2">2本机蓝牙适配状态</button>
<button type="primary" class="button" bindtap="lanya3">3搜索周边蓝牙设备</button>
<button type="primary" class="button" bindtap="lanya4">4获取所有周边蓝牙设备信息</button>
<block wx:for="{{devices}}" wx:key="{{test}}">
<button type="primary" class="button" id="{{item.deviceId}}" style='background-color:red' bindtap="connectTO">5连接蓝牙设备{{item.name}}</button>
</block>

</view>

如上述代码,我们增加了循环发现设备的按钮连接蓝牙设备,后面跟着是蓝牙设备的名称,devices设备的获取请参考上一章节,如果发现周边蓝牙设备为多个,那么此按钮就会显示多个,用户可以从中选择一个适合自己的设备进行连接。按钮绑定的函数为connectTO,connectTO函数实现方式如下:

2、打开lanya.js文件,实现wx.closeBLEConnection(OBJECT)接口函数connectTO代码如下:

//连接设备
connectTO: function (e) {
var that = this;
wx.createBLEConnection({
deviceId: e.currentTarget.id,
success: function (res) {
console.log('连接设备返回:'+res.errMsg);
that.setData({
connectedDeviceId: e.currentTarget.id,
msg: "已连接" + e.currentTarget.id + '==='+'连接设备返回:'+res.errMsg,
msg1: "",
})
},
fail: function () {
console.log("调用失败");
},
complete: function () {
console.log("调用结束");
}

})
console.log(that.data.connectedDeviceId);
}


3、启动硬件蓝牙设备(例如蓝牙打印机,蓝牙锁等),打开手机蓝牙,打开手机微信app,然后点击微信小程序开发工具头部的预览按钮,会出现一个二维码,用微信app扫描此二维码,加载小程序应用。


效果如下

如上图所示,本作者打开蓝牙设备,加载小程序应用,点击 1 2 3 4按钮之后,循环发现周边设备两台,根据设备信息,我的设备名称结尾为 3124的设备,如上图,点击此按钮,等待设备连接,,连接成功后的效果如下:

如上图所示,设备连接成功后的日志信息已打印输出到页面中了。


lanya.wxml源码

<view class="content">
<view>日志信息:
<textarea style='border:1px solid #ccc'>
{{msg}}
</textarea>
</view>

<button type="primary" class="button" bindtap="lanya1">1初始化蓝牙适配器</button>
<button type="primary" class="button" bindtap="lanya2">2本机蓝牙适配状态</button>
<button type="primary" class="button" bindtap="lanya3">3搜索周边蓝牙设备</button>
<button type="primary" class="button" bindtap="lanya4">4获取所有周边蓝牙设备信息</button>
<block wx:for="{{devices}}" wx:key="{{test}}">
<button type="primary" class="button" id="{{item.deviceId}}" style='background-color:red' bindtap="connectTO">5连接蓝牙设备{{item.name}}</button>
</block>

</view><!--www.vxzsk.com V型知识库 原创 -->


lanya.js源码

// pages/lanya/lanya.js www.vxzsk.com V型知识库原创
Page({

/**
   * 页面的初始数据
   */
data: {
},

/**
   * 生命周期函数--监听页面加载
   */
onLoad: function (options) {
},

/**
   * 生命周期函数--监听页面初次渲染完成
   */
onReady: function () {
},

/**
   * 生命周期函数--监听页面显示
   */
onShow: function () {
},

/**
   * 生命周期函数--监听页面隐藏
   */
onHide: function () {
},

/**
   * 生命周期函数--监听页面卸载
   */
onUnload: function () {
},

/**
   * 页面相关事件处理函数--监听用户下拉动作
   */
onPullDownRefresh: function () {
},

/**
   * 页面上拉触底事件的处理函数
   */
onReachBottom: function () {
},

/**
   * 用户点击右上角分享
   */
onShareAppMessage: function () {
},
// 初始化蓝牙适配器
lanya1: function () {
var that = this;
wx.openBluetoothAdapter({
success: function (res) {
console.log('初始化蓝牙适配器返回' + JSON.stringify(res))
//页面日志显示
that.setData({
msg: JSON.stringify(res)
})
},
fail:function(res){
console.log('初始化蓝牙适配器失败' + JSON.stringify(res))
}
})
},
// 本机蓝牙适配器状态
lanya2: function () {
var that = this;
wx.getBluetoothAdapterState({
success: function (res) {
//页面日志显示
that.setData({
msg: "本机蓝牙适配器状态" + "/" + JSON.stringify(res.errMsg) + "==是否可用:" +  res.available

})
},
fail:function(res){
//页面日志显示
that.setData({
msg: "本机蓝牙适配器状态" + "/" + JSON.stringify(res.errMsg) + "==是否可用:" + res.available


})

}
})
},
//搜索设备
lanya3: function () {
var that = this;
wx.startBluetoothDevicesDiscovery({
services: ['FEE7'],
success: function (res) {
that.setData({
msg: "搜索设备" + JSON.stringify(res),
})
console.log('搜索设备返回' + JSON.stringify(res))
}
})
},
// 获取所有已发现的设备
lanya4: function () {
var that = this;
wx.getBluetoothDevices({
success: function (res) {
that.setData({
msg: "搜索设备" + JSON.stringify(res.devices),
devices: res.devices
})
console.log('搜到的蓝牙设备数目:' + res.devices.length)
console.log('获取到周边搜到的设备信息:' + JSON.stringify(res.devices))
}
})
},
//连接设备
connectTO: function (e) {
var that = this;
wx.createBLEConnection({
deviceId: e.currentTarget.id,
success: function (res) {
console.log('连接设备返回:'+res.errMsg);
that.setData({
connectedDeviceId: e.currentTarget.id,
msg: "已连接" + e.currentTarget.id + '==='+'连接设备返回:'+res.errMsg,
msg1: "",
})
},
fail: function () {
console.log("调用失败");
},
complete: function () {
console.log("调用结束");
}

})
console.log(that.data.connectedDeviceId);
}
})

把上述源码复制到工程里面即可实现上述功能。


此文章本站原创,地址 https://www.vxzsk.com/1862.html   转载请注明出处!谢谢!

感觉本站内容不错,读后有收获?小额赞助,鼓励网站分享出更好的教程