微信硬件蓝牙开发各种坑不完全开发指南

写于:2016-4-15

几个基本要用的东西:

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、写方法:

wx.config({
    beta:true,                  //坑:这个很重要,必须配置这个为true,才能调用微信的硬件API
    debug: false,               //是否开启调试模式,会自动弹一些消息框显示微信返回的数据
    appId: 这里填写appID,        //让后台返回appid
    timestamp: 时间戳,          //让后台返回生成证书时用的时间戳
    nonceStr: 随机字符串,        //让后台返回生成证书时用的随机串
    signature: 证书,            //让后台返回已当前URL地址生成的证书
    jsApiList: [                //需要调用的接口,都得在这里面写一遍
        "openWXDeviceLib",//初始化设备库(只支持蓝牙设备)
        "closeWXDeviceLib",//关闭设备库(只支持蓝牙设备)
        "getWXDeviceInfos",//获取设备信息(获取当前用户已绑定的蓝牙设备列表)
        "sendDataToWXDevice",//发送数据给设备
        "startScanWXDevice",//扫描设备(获取周围所有的设备列表,无论绑定还是未被绑定的设备都会扫描到)
        "stopScanWXDevice",//停止扫描设备
        "connectWXDevice",//连接设备
        "disconnectWXDevice",//断开设备连接
        "getWXDeviceTicket",//获取操作凭证

        //下面是监听事件:
        "onWXDeviceBindStateChange",//微信客户端设备绑定状态被改变时触发此事件
        "onWXDeviceStateChange",//监听连接状态,可以监听连接中、连接上、连接断开
        "onReceiveDataFromWXDevice",//接收到来自设备的数据时触发
        "onScanWXDeviceResult",//扫描到某个设备时触发
        "onWXDeviceBluetoothStateChange",//手机蓝牙打开或关闭时触发
    ]
});

上面这个方法,在进入页面时应该首先被调用,这是初始化微信JS-SDK

其中:

beta 这个参数需设为true,才能调用那些微信还没有正式开放的新接口

appID,timestamp,nonceStr,signature这几个由后台传递到前端。

生成证书的方法JS-SDK文档中有,此处暂时省略

4、继续写方法:

wx.ready(function(){
    //初始化设备库 需填写参数 公众号的原始ID
    wx.invoke(‘openWXDeviceLib‘, {‘brandUserName‘:‘gh_xxxxxxxxxx‘}, function(res){
        //自己把res输出来看一下吧,里面包括了是否初始化成功,当前手机的蓝牙状态等信息
        //这里有个坑,当时研究了好久,跟论坛里的人讨论了半天,就是IOS下正常,
        //安卓下,请带上这个参数:brandUserName:后面是你公众号的原始ID。不然会初始化失败
        //正式的公众号,也有原始ID,是gh_开头的那个,进入公众号,自己找一下吧,有的
        //测试号,就用测试号管理页面右上角的那个gh_开头的那一串数字
    });

        //手机蓝牙状态改变时触发 (这是监听事件的调用方法,注意,监听事件都没有参数)
        wx.on(‘onWXDeviceBluetoothStateChange‘,function(res){
                //把res输出来看吧
        });

        //设备绑定状态改变事件(解绑成功,绑定成功的瞬间,会触发)
        wx.on(‘onWXDeviceBindStateChange‘,function(res){
                //把res输出来看吧
        });

        //设备连接状态改变
        wx.on(‘onWXDeviceStateChange‘,function(res){
            //有3个状态:connecting连接中,connected已连接,unconnected未连接
            //每当手机和设备之间的状态改变的瞬间,会触发一次
        });

        //接收到设备传来的数据
        wx.on(‘onReceiveDataFromWXDevice‘,function(res){
                //接收到的原始数据:JSON.stringify(res)
                //自己去百度下载一个jbase64.js,可以对字符串进行base64编码解码
                //这里就是用的jbase64.js对原始数据进行解码
                var unicode= BASE64.decoder(res.base64Data);
                var str = ‘‘;
                for(var i = 0 , len =  unicode.length ; i < len ;++i){
                         str += String.fromCharCode(unicode[i]);
                }
                //解码后的数据:str
                //坑:你们测试的时候,不要在这里用alert(),页面会卡死。自己把信息输出到页面中查看吧
                //不要在这里alert出来
            });
        });

5、继续写方法:

wx.error(function(res){
    alert("wx.error错误:"+JSON.stringify(res));
    //如果初始化出错了会调用此方法,没什么特别要注意的
});

6、扫描设备:

(我做的那个项目,是通过手机扫描附近的设备,得到设备的deviceid,然后进行绑定,不是用户扫描二维码进行绑定,所以这里介绍扫描设备的过程)

//扫描前请先监听设备扫描事件
wx.on(‘onScanWXDeviceResult‘,function(res){
    alert("扫描到1个设备");
    //自己解析一下res,里面会有deviceid,扫描设备的目的就是为了得到这个
    //然后就可以开始绑定了
}

//开始扫描
wx.invoke("startScanWXDevice",{"btVersion":"ble"},function(res){});
//这里填的参数是ble,也可以填bc,bc是经典蓝牙,我们做的这个设备不支持经典蓝牙,所以直接填ble
//安卓系统不能同时支持bel和bc,这个后面详细说一下
//执行此方法后,就开始一直不停的扫描,扫描到了设备会触发上面的监听事件

//如果不想扫了,可以停止扫描
wx.invoke("stopScanWXDevice",{},function(res){});

7、绑定和解除绑定

//用户绑定设备
//1、先获取操作凭证(type为1表示绑定,2表示解除绑定)
wx.invoke(‘getWXDeviceTicket‘,{"deviceId":"填写设备的deviceID","type":1},function(res){
    if(res.err_msg !="getWXDeviceTicket:ok"){
            alert("获取操作凭证失败,请重试");
            return;
    }else{
        //2.将deviceID和操作凭证通过ajax传给后台 进行绑定
        //后台应该是有当前用户的openId的,其实前端也可以获取到,但比较麻烦
        //我们这边的做法是,后台在数据库里保存了用户的openId,每次要用直接从数据库拿
        //就不用每次还去调微信的接口拿,太麻烦了
        //...此处ajax代码略
    }
});

//用户解除绑定
//与上面的方法基本相同,只有type参数不同
wx.invoke(‘getWXDeviceTicket‘,{"deviceId":"填写设备的deviceID","type":2},function(res){
    if(res.err_msg !="getWXDeviceTicket:ok"){
            alert("获取操作凭证失败,请重试");
            return;
    }else{
        //2.将deviceID和操作凭证通过ajax传给后台 进行绑定
        ...代码略
    }
});

8、向设备发送数据

wx.invoke(‘sendDataToWXDevice‘, {‘deviceId‘:dev,"base64Data":BASE64.encoder(str)}, function(res){
    if(res.err_msg !="sendDataToWXDevice:ok"){
            alert("数据已发送");
    }else{
            alert("数据发送失败");
    }
});
//发送的数据需要经过base64编码

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

当用户绑定了设备后,微信会不停的尝试连接设备,所以其实不用程序员写代码去连接设备。

下面来说一下遇到的各种坑:(上面内容中提到的就不说了)

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页面中才能接收到。否则不报错,但也接收不到。

5、继续补充中

时间: 2024-10-01 05:11:24

微信硬件蓝牙开发各种坑不完全开发指南的相关文章

微信硬件蓝牙扫描绑定JSAPI发送数据

1:登录微信公众平台   查看权限接口  看设备功能是否开通 如果已开通(进行已下操作)   未开通先去开通 2:找到功能里面的  设备功能点击进去 选择添加产品  如果是蓝牙 选择蓝牙系列的 我这里是蓝牙就说蓝牙的 创建完成  回给你个产品ID  继续以下操作 3:开发者工具  在线调式  现获取token 3.1-接着选择 硬件调式api   选择设备授权获取deciceid和二维码/device/getqrcode     下面会出现让你填写刚刚获取到的token 填完token 后面千万

从零开始搭建微信硬件开发环境全过程——1小时掌握微信硬件开发流程

笔者决定在嵌入式企鹅圈2016年的首篇文章中,发表微信硬件物联领域极具实践价值的文章,它将能指引和帮助任何有兴趣于物联网开发的童鞋们快速掌握微信硬件开发流程,只需一个小时,而再不需要通过揣摩微信硬件浩瀚的文档资料来完成艰难构建. 笔者之前曾经撰写过一篇文章<基于微信硬件公众平台的智能控制开发流程>介绍微信硬件开发的流程,但该篇文章是理论性的描述.而本篇文章是完全可操作实践的,请结合两篇文章理解.技术咨询请发邮件至[email protected] 本篇文章的目的是快速搭建微信硬件开发的环境,完

从零開始搭建微信硬件开发环境全过程——1小时掌握微信硬件开发流程

笔者决定在嵌入式企鹅圈2016年的首篇文章中,发表微信硬件物联领域极具实践价值的文章,它将能指引和帮助不论什么有兴趣于物联网开发的童鞋们高速掌握微信硬件开发流程.仅仅需一个小时.而再不须要通过揣摩微信硬件浩瀚的文档资料来完毕艰难构建. 笔者之前以前撰写过一篇文章<基于微信硬件公众平台的智能控制开发流程>介绍微信硬件开发的流程,但该篇文章是理论性的描写叙述.而本篇文章是全然可操作实践的,请结合两篇文章理解.技术咨询请发邮件至[email protected] 本篇文章的目的是高速搭建微信硬件开发

基于微信硬件公众平台的智能控制开发流程

一.微信硬件公众平台整体架构 上一篇<物联网架构场景技术分析>已经探讨和分析了物联网架构的演进,基于微信硬件公众平台的智能控制方案即属于文中的第三种架构--基于统一后台服务的物联架构.其中的架构如下: 各部分的角色和分工如下: 1.微信硬件公众号平台服务器,是物联网的基础和核心部分,其负责外设设备ID的认证,类似公安部给每个公民一个身份证一样,保证每个外设都有一个合法并且唯一的ID.目前微信平台的设备ID由两部分组成,一部分是厂商运维的公众号(即手机微信关注的公众号)的原始ID,称为设备类型,

微信硬件H5面板开发(一) ---- 调用openApi

微信硬件平台是微信推出连接物与人,物与物的IOT解决方案.也就是说可以通过微信控制各种智能设备.比如一些蓝牙设备.空调.电视等等. 我本身不懂硬件(虽然是电子信息专业),硬件是北航的两个研究生在弄,小团队里我负责开发H5自定义面板,刚开始看官方文档各种迷糊,对于jssdk.jsapi.Airkiss.openApi.直连SDK都不知道该用哪个做,官方论坛问问题基本上没结果,加了几个微信硬件群问问题,发现好些开发者和我一样,同一个问题,发到几个群里问,画面好心酸.给wxthings发邮件问,能回复

微信硬件开发步骤

微信硬件开发步骤 一. 组册微信测试号 1. 首先登录http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login,然后进行组册,可以申请到一个测试号 2. 填写调试时候的接口配置信息,这样调试的时候微信后台发来的信息都会传送到这个指定的URL网页上面 这里的token相当于一种验证码,可以随意设置,只要与后面自己编写的用来响应微信后台的PHP代码里面的token值一致就可以,类似于一种加密的措施. 二. 注册一台云服务器 由第一步我

微信小程序开发填坑指南V1

近期用了一星期的时间,开发了一个小程序.小程序名称是:小特Jarvis,取自钢铁侠的管家. 后台采用C#编写,WebAPI接口.其实开发时间并不多,小程序本身提供的API,相比公众号的API来说,已经封装了好多东西,我们只负责简单调用即可.而且,提供的开发工具也很方便,开发环境和VisualStudio很类似,包括快捷键(不知道Java的开发员是不是也有这感觉?) 好了说重点.今天是个总结,把这一星期开发时遇到的坑整理下,希望其他人遇到时能有个参考.其实开发的坑不多,部署的坑最多.开始咯 1,多

微信公众号开发之坑(一)

有个说法是微信浏览器==移动端IE6.分享一下开发中遇到的坑 1.在自己的公众号能实现支付,从别的公众号进来不能支付. 既然自己的公众号能支付了,那么很有可能是跳转过来的公众号的url出现的问题.正确的:htt P://3w.yijia.com/wechat/pay/?id=1错误的:htt P://3w.yijia.com/wechat/pay?id=1 参数(也就是问号之前)要以/结尾,因为这是公众号支付配置的要求. 2.微信api上传图片,在苹果和安卓系统下的小区别.问题描述:要上传多张图

微信硬件H5面板开发(二) ---- 实现一个灯的控制

在第一节中讲解了openApi的调用,这一篇讲一下如何实现一个灯的控制.就用微信提供的lamp例子来做,将代码扒下来(实在是没办法,没有示例),整合到自己的项目中.lamp源码:http://files.cnblogs.com/files/stoneniqiu/lamp.zip. 你可以自己扒,带参数的页面在浏览器中打开会马上跳转,不带参数的会提示参数不全,需要用mobile模式观看. 呈现的界面如下: 目录结构 解压开lamp.js ,目录如下,这个demo是基于sea.js+zepto实现,