Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

Example Analysis of Wechat hardware JS-Api Development

2025-04-11 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

这篇文章主要为大家展示了"微信硬件JS-Api开发的示例分析",内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下"微信硬件JS-Api开发的示例分析"这篇文章吧。

1.引入JS库

2.为页面注入配置信息

wx.config({ beta: true, // 开启内测接口调用,注入wx.invoke方法,非常重要!!必须有这个 debug: true,//开启调试接口,alert运行结果 appId: '',//必填,公众号的唯一标识, timestamp: '',//必填,生成签名的时间戳 nonceStr: '',//必填,生成签名的随机串 signature: '',//必填,签名 jsApiList: []//要调用的js函数,必须把函数名字写入数组});

这里我的jsApiList为

jsApiList: [ 'openWXDeviceLib',//初始化设备库(只支持蓝牙设备) 'closeWXDeviceLib',//关闭设备库(只支持蓝牙设备) 'getWXDeviceInfos',//获取设备信息(获取当前用户已绑定的蓝牙设备列表) 'sendDataToWXDevice',//发送数据给设备 'startScanWXDevice',//扫描设备(获取周围所有的设备列表,无论绑定还是未被绑定的设备都会扫描到) 'stopScanWXDevice',//停止扫描设备 'connectWXDevice',//连接设备 'disconnectWXDevice',//断开设备连接 'getWXDeviceTicket',//获取操作凭证 'onWXDeviceBindStateChange',//微信客户端设备绑定状态被改变时触发此事件 'onWXDeviceStateChange',//监听连接状态,可以监听连接中、连接上、连接断开 'onReceiveDataFromWXDevice',//接收到来自设备的数据时触发 'onScanWXDeviceResult',//扫描到某个设备时触发 'onWXDeviceBluetoothStateChange',//手机蓝牙打开或关闭时触发 ]

如果想要测一下微信版本是不是支持这几个api,可以这样写:

wx.checkJsApi({ jsApiList: ['openWXDeviceLib', 'onScanWXDevicesResult', 'getWXDeviceInfos'], // 需要检测的JS接口列表,所有JS接口列表见附录2, success: function (res) { console.log(res); }});

3.初始化设备库函数

通过ready接口处理成功验证

wx.ready(function () { wx.invoke('openWXDeviceLib', {connType: 'blue'}, function (res) { console.debug('openWXDeviceLib重新打开设备库==>'); console.log(res); });})

坑:重新扫描设备根本什么都扫不出来,即使是刷新页面也不顶用

解决方法:每次扫描前,先调用closeWXDeviceLib关闭设备库,再调用openWXDeviceLib打开设备库。这样就相当于重新初始化了一遍设备库,你现在再重新扫描,就可以扫描到设备了。

代码:

wx.invoke("stopScanWXDevice", {}, function (res) { console.debug('stopScanWXDevice'); console.log(res); });wx.invoke("closeWXDeviceLib", {}, function (res) { console.debug('closeWXDeviceLib关闭设备库==>'); console.log(res);});wx.invoke('openWXDeviceLib', {connType: 'blue'}, function (res) { console.debug('openWXDeviceLib重新打开设备库==>'); console.log(res);});

4.监听设备返回的信息

wx.on('onReceiveDataFromWXDevice', function (res) { console.warn('onReceiveDataFromWXDevice=>'); console.log(JSON.stringify(res));});

5.发送消息到设备

收发数据前需进行 base64 的编解码。

这里,我用到一个库:

出处:

http://www.php.cn/

var data={"deviceId":deviceId,"base64Data": Base64.encode('你要发送的数据')};console.log(data);wx.invoke('sendDataToWXDevice',data , function(res){ //回调 console.info('发消息到设备sendMsg'); console.log(data); console.log(res); $('#dataFromDevice').append('发送消息的结果:'+JSON.stringify(res)); alert('已发送 请查看控制板');});

说明:

1.需要在微信对应设备号内才能使用对应的api。

2.必须要在设备号设置的安全域名下才能正常使用api

3.本篇内所有的console.log 等输出到控制台 都是用的vconsole调试工具实现。

1.引入JS库

2.为页面注入配置信息

wx.config({ beta: true, // 开启内测接口调用,注入wx.invoke方法,非常重要!!必须有这个 debug: true,//开启调试接口,alert运行结果 appId: '',//必填,公众号的唯一标识, timestamp: '',//必填,生成签名的时间戳 nonceStr: '',//必填,生成签名的随机串 signature: '',//必填,签名 jsApiList: []//要调用的js函数,必须把函数名字写入数组});

这里我的jsApiList为

jsApiList: [ 'openWXDeviceLib',//初始化设备库(只支持蓝牙设备) 'closeWXDeviceLib',//关闭设备库(只支持蓝牙设备) 'getWXDeviceInfos',//获取设备信息(获取当前用户已绑定的蓝牙设备列表) 'sendDataToWXDevice',//发送数据给设备 'startScanWXDevice',//扫描设备(获取周围所有的设备列表,无论绑定还是未被绑定的设备都会扫描到) 'stopScanWXDevice',//停止扫描设备 'connectWXDevice',//连接设备 'disconnectWXDevice',//断开设备连接 'getWXDeviceTicket',//获取操作凭证 'onWXDeviceBindStateChange',//微信客户端设备绑定状态被改变时触发此事件 'onWXDeviceStateChange',//监听连接状态,可以监听连接中、连接上、连接断开 'onReceiveDataFromWXDevice',//接收到来自设备的数据时触发 'onScanWXDeviceResult',//扫描到某个设备时触发 'onWXDeviceBluetoothStateChange',//手机蓝牙打开或关闭时触发 ]

如果想要测一下微信版本是不是支持这几个api,可以这样写:

wx.checkJsApi({ jsApiList: ['openWXDeviceLib', 'onScanWXDevicesResult', 'getWXDeviceInfos'], // 需要检测的JS接口列表,所有JS接口列表见附录2, success: function (res) { console.log(res); }});

3.初始化设备库函数

通过ready接口处理成功验证

wx.ready(function () { wx.invoke('openWXDeviceLib', {connType: 'blue'}, function (res) { console.debug('openWXDeviceLib重新打开设备库==>'); console.log(res); });})

坑:重新扫描设备根本什么都扫不出来,即使是刷新页面也不顶用

解决方法:每次扫描前,先调用closeWXDeviceLib关闭设备库,再调用openWXDeviceLib打开设备库。这样就相当于重新初始化了一遍设备库,你现在再重新扫描,就可以扫描到设备了。

代码:

wx.invoke("stopScanWXDevice", {}, function (res) { console.debug('stopScanWXDevice'); console.log(res); });wx.invoke("closeWXDeviceLib", {}, function (res) { console.debug('closeWXDeviceLib关闭设备库==>'); console.log(res);});wx.invoke('openWXDeviceLib', {connType: 'blue'}, function (res) { console.debug('openWXDeviceLib重新打开设备库==>'); console.log(res);});

4.监听设备返回的信息

wx.on('onReceiveDataFromWXDevice', function (res) { console.warn('onReceiveDataFromWXDevice=>'); console.log(JSON.stringify(res));});

5.发送消息到设备

收发数据前需进行 base64 的编解码。

这里,我用到一个库:

出处:

http://www.php.cn/

var data={"deviceId":deviceId,"base64Data": Base64.encode('你要发送的数据')};console.log(data);wx.invoke('sendDataToWXDevice',data , function(res){ //回调 console.info('发消息到设备sendMsg'); console.log(data); console.log(res); $('#dataFromDevice').append('发送消息的结果:'+JSON.stringify(res)); alert('已发送 请查看控制板');});

说明:

1.需要在微信对应设备号内才能使用对应的api。

2.必须要在设备号设置的安全域名下才能正常使用api

3.本篇内所有的console.log 等输出到控制台 都是用的vconsole调试工具实现。

以上是"微信硬件JS-Api开发的示例分析"这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report