微信硬件蓝牙开发指南

几个基本要用的东西:
1、微信公众平台
网址:https://mp.weixin.qq.com
可以在此申请微信公众号,获取微信测试号。
微信测试号拥有所有功能权限,如果你有正式的企业服务号,就不必用测试号了。

2、微信JS-SDK说明文档
网址:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
到时候会引入一个JS文件,是用来调用微信提供的那些接口的

3、微信硬件平台说明文档
网址(新版):http://iot.weixin.qq.com/wiki/new/index.html
网址(旧版):http://iot.weixin.qq.com/wiki/index.html
新版和旧版唯一的区别是,新版没有JS硬件API的说明页(但可以在下载中心自己下载)
开始开发

1、首先,自己到微信公众平台申请一个微信公众号,就选个人订阅号。
2、登录你的公众号,进入公众平台管理页,左边最下面有个“开发者工具”。
3、点“开发者工具”,进去后找到“公众平台测试帐号”,自己按照步骤申请开通一个。
4、进入测试号管理页面,就会得到:
原始ID:gh_xxxxxxxxxx (右上角显示的,这个是微信原始ID,不是微信号)
(坑:微信原始ID 和 微信帐号不是同一个,微信帐号在之后都不会用到,用到的是原始ID)
appID:wxxxxxxxxxxxx (appID)
appsecret:xxxxxxxxxxxxxx (密钥)
5、测试号管理页面,下面找到“JS接口安全域名”,要配置成你们自己的服务器域名,后面有些微信API会返回数据,它会去匹配这个域名,如果不是指定的域名,会报错。
6、继续往下看,下面有个“体验接口权限表”,在里面找到“设备功能”,开通它
7、开通设备功能后,点右边的“设置”,进入设备功能页面
8、自己”添加产品”,随便搞,连接类型勾选”蓝牙”即可(添加完成后,该产品有个产品编号,后面设备授权时有用)

======= 以上是公众平台的配置,下面开始写前端代码 ======
1、新建HTML,基本结构写好。
2、引入”http://res.wx.qq.com/open/js/jweixin-1.0.0.js“,这个JS

3、写方法:

[javascript]  view plain  copy
  print ? 在CODE上查看代码片 派生到我的代码片
  1. <code class="hljs d">wx.config({  
  2.     beta:true,                  //坑:这个很重要,必须配置这个为true,才能调用微信的硬件API  
  3.     debug: false,               //是否开启调试模式,会自动弹一些消息框显示微信返回的数据  
  4.     appId: 这里填写appID,        //让后台返回appid  
  5.     timestamp: 时间戳,          //让后台返回生成证书时用的时间戳  
  6.     nonceStr: 随机字符串,        //让后台返回生成证书时用的随机串  
  7.     signature: 证书,            //让后台返回已当前URL地址生成的证书  
  8.     jsApiList: [                //需要调用的接口,都得在这里面写一遍  
  9.         "openWXDeviceLib",//初始化设备库(只支持蓝牙设备)  
  10.         "closeWXDeviceLib",//关闭设备库(只支持蓝牙设备)  
  11.         "getWXDeviceInfos",//获取设备信息(获取当前用户已绑定的蓝牙设备列表)  
  12.         "sendDataToWXDevice",//发送数据给设备  
  13.         "startScanWXDevice",//扫描设备(获取周围所有的设备列表,无论绑定还是未被绑定的设备都会扫描到)  
  14.         "stopScanWXDevice",//停止扫描设备  
  15.         "connectWXDevice",//连接设备  
  16.         "disconnectWXDevice",//断开设备连接  
  17.         "getWXDeviceTicket",//获取操作凭证  
  18.    
  19.         //下面是监听事件:  
  20.         "onWXDeviceBindStateChange",//微信客户端设备绑定状态被改变时触发此事件  
  21.         "onWXDeviceStateChange",//监听连接状态,可以监听连接中、连接上、连接断开  
  22.         "onReceiveDataFromWXDevice",//接收到来自设备的数据时触发  
  23.         "onScanWXDeviceResult",//扫描到某个设备时触发  
  24.         "onWXDeviceBluetoothStateChange",//手机蓝牙打开或关闭时触发  
  25.     ]  
  26. });</code>  
上面这个方法,在进入页面时应该首先被调用,这是初始化微信JS-SDK
其中:
beta 这个参数需设为true,才能调用那些微信还没有正式开放的新接口
appID,timestamp,nonceStr,signature这几个由后台传递到前端。
生成证书的方法JS-SDK文档中有,此处暂时省略

4:继续写方法

[javascript]  view plain  copy
  print ? 在CODE上查看代码片 派生到我的代码片
  1. <code class="hljs javascript">wx.ready(function(){  
  2.     //初始化设备库 需填写参数 公众号的原始ID  
  3.     wx.invoke('openWXDeviceLib', {'brandUserName':'gh_xxxxxxxxxx'}, function(res){  
  4.         //自己把res输出来看一下吧,里面包括了是否初始化成功,当前手机的蓝牙状态等信息  
  5.         //这里有个坑,当时研究了好久,跟论坛里的人讨论了半天,就是IOS下正常,  
  6.         //安卓下,请带上这个参数:brandUserName:后面是你公众号的原始ID。不然会初始化失败  
  7.         //正式的公众号,也有原始ID,是gh_开头的那个,进入公众号,自己找一下吧,有的  
  8.         //测试号,就用测试号管理页面右上角的那个gh_开头的那一串数字  
  9.     });  
  10.    
  11.         //手机蓝牙状态改变时触发 (这是监听事件的调用方法,注意,监听事件都没有参数)  
  12.         wx.on('onWXDeviceBluetoothStateChange',function(res){  
  13.                 //把res输出来看吧  
  14.         });  
  15.    
  16.         //设备绑定状态改变事件(解绑成功,绑定成功的瞬间,会触发)  
  17.         wx.on('onWXDeviceBindStateChange',function(res){  
  18.                 //把res输出来看吧  
  19.         });  
  20.    
  21.         //设备连接状态改变  
  22.         wx.on('onWXDeviceStateChange',function(res){  
  23.             //有3个状态:connecting连接中,connected已连接,unconnected未连接  
  24.             //每当手机和设备之间的状态改变的瞬间,会触发一次  
  25.         });  
  26.    
  27.         //接收到设备传来的数据  
  28.         wx.on('onReceiveDataFromWXDevice',function(res){  
  29.                 //接收到的原始数据:JSON.stringify(res)  
  30.                 //自己去百度下载一个jbase64.js,可以对字符串进行base64编码解码  
  31.                 //这里就是用的jbase64.js对原始数据进行解码  
  32.                 var unicode= BASE64.decoder(res.base64Data);  
  33.                 var str = '';    
  34.                 for(var i = 0 , len =  unicode.length ; i < len ;++i){    
  35.                          str += String.fromCharCode(unicode[i]);    
  36.                 }  
  37.                 //解码后的数据:str  
  38.                 //坑:你们测试的时候,不要在这里用alert(),页面会卡死。自己把信息输出到页面中查看吧  
  39.                 //不要在这里alert出来  
  40.             });  
  41.         });</code>  


5、继续写方法:

[javascript] view plain copy
 print?在CODE上查看代码片派生到我的代码片
  1. <code class="hljs javascript">wx.error(function(res){  
  2.     alert("wx.error错误:"+JSON.stringify(res));  
  3.     //如果初始化出错了会调用此方法,没什么特别要注意的  
  4. });</code>  
6、扫描设备:
(是通过手机扫描附近的设备,得到设备的deviceid,然后进行绑定,不是用户扫描二维码进行绑定,所以这里介绍扫描设备的过程)

[javascript] view plain copy
 print?在CODE上查看代码片派生到我的代码片
  1. <code class="hljs javascript">//扫描前请先监听设备扫描事件  
  2. wx.on('onScanWXDeviceResult',function(res){  
  3.     alert("扫描到1个设备");  
  4.     //自己解析一下res,里面会有deviceid,扫描设备的目的就是为了得到这个  
  5.     //然后就可以开始绑定了  
  6. }  
  7.    
  8. //开始扫描  
  9. wx.invoke("startScanWXDevice",{"btVersion":"ble"},function(res){});  
  10. //这里填的参数是ble,也可以填bc,bc是经典蓝牙, 
  11. //安卓系统不能同时支持bel和bc,这个后面详细说一下  
  12. //执行此方法后,就开始一直不停的扫描,扫描到了设备会触发上面的监听事件  
  13.    
  14. //如果不想扫了,可以停止扫描  
  15. wx.invoke("stopScanWXDevice",{},function(res){});</code>  

7、绑定和解除绑定

[javascript]  view plain  copy
  print ? 在CODE上查看代码片 派生到我的代码片
  1. <code class="hljs r">//用户绑定设备  
  2. //1、先获取操作凭证(type为1表示绑定,2表示解除绑定)  
  3. wx.invoke('getWXDeviceTicket',{"deviceId":"填写设备的deviceID","type":1},function(res){  
  4.     if(res.err_msg !="getWXDeviceTicket:ok"){  
  5.             alert("获取操作凭证失败,请重试");    
  6.             return;  
  7.     }else{  
  8.         //2.将deviceID和操作凭证通过ajax传给后台 进行绑定     
  9.         //后台应该是有当前用户的openId的,其实前端也可以获取到,但比较麻烦  
  10.         //我们这边的做法是,后台在数据库里保存了用户的openId,每次要用直接从数据库拿  
  11.         //就不用每次还去调微信的接口拿,太麻烦了  
  12.         //...此处ajax代码略        
  13.     }  
  14. });  
  15.    
  16. //用户解除绑定  
  17. //与上面的方法基本相同,只有type参数不同  
  18. wx.invoke('getWXDeviceTicket',{"deviceId":"填写设备的deviceID","type":2},function(res){  
  19.     if(res.err_msg !="getWXDeviceTicket:ok"){  
  20.             alert("获取操作凭证失败,请重试");    
  21.             return;  
  22.     }else{  
  23.         //2.将deviceID和操作凭证通过ajax传给后台 进行绑定     
  24.         ...代码略        
  25.     }  
  26. });</code>  

8、向设备发送数据

[javascript]  view plain  copy
  print ? 在CODE上查看代码片 派生到我的代码片
  1. <code class="hljs javascript">wx.invoke('sendDataToWXDevice', {'deviceId':dev,"base64Data":BASE64.encoder(str)}, function(res){  
  2.     if(res.err_msg =="sendDataToWXDevice:ok"){  
  3.             alert("数据已发送");  
  4.     }else{  
  5.             alert("数据发送失败");  
  6.     }  
  7. });  
  8. //发送的数据需要经过base64编码</code>  

以上是前端页面中,基本就这些代码

在写前端页面时候,后端需要对设备进行授权,
当用户绑定了设备后,微信会不停的尝试连接设备,所以其实不用程序员写代码去连接设备。

下面来说一下遇到的各种坑:(上面内容中提到的就不说了)
1、开发流程:
①、硬件厂商,他们只要得到了设备的mac地址,就可以开始授权了(好像只要有蓝牙板子,就有mac地址了)。
②、然后再开始生产设备
③、然后才卖给用户
④、用户关注公众号,扫描设备(如果用的二维码方式,那就是扫二维码。我们没有用二维码那种方式)
⑤、用户绑定设备
⑥、微信自动连接设备
⑦、连接上后,就可以收发数据了

2、关于授权:
我们用的授权新接口,即不需要厂商提供deviceid,由微信分配deviceid
然后是授权时的那些参数:
product_id:就是你之前“添加设备”后,就会得到那个编号
connect_protocol:连接协议
只能填3,或者只能填1.你别弄成:3|1,
下面写了,安卓设备不能同时支持ble和经典蓝牙
iOS一切正常,但是填成3|1,你就发现安卓的ble蓝牙调用“getWXDeviceInfos”(获取设备信息),获取不到!
如果用户的手机是经典蓝牙,你就写一个html页面,搞个按钮叫“刷成经典蓝牙”,用户可以自己去更新设备属性(就是授权那个地方,不是可以更新设备属性吗,让你们后台工程师写个接口,用户可以自己去把connect_protocol刷成1)

3、IOS连接设备很快很稳定,安卓连不上设备,显示“已连接0个设备”:
在微信硬件平台的文档里面的某个地方,有一句话,说安卓设备要先订阅个什么东西,订阅上了,这个时候再连接就OK,因为设备只发了一次Auth和Init包,如果错过这个时机,就错过了…就再也连不上了,除非设备断电重启。
但IOS估计是订阅那个什么东西非常快,不会过期,所以一下就连上了。

4、关于设备向手机发数据:
设备发的数据,里面有两个值,一个代表包括包头包尾的总长度,一个代表除去包头包尾的长度,必须与所发数据的实际情况相对应,HTML页面中才能接收到。否则不报错,但也接收不到。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值