html5蓝牙 开发 h5网页读取蓝牙数据
  njkhuebfFFM9 2023年11月30日 76 0


我们上一章节介绍了微信硬件蓝牙设备的绑定,连接,并且获取到硬件设备的deviceid,这节课接着上一章节的基础上来介绍通过微信H5界面向设备发送数据,并且接收设备返回的数据信息。

第一、首先看两个微信硬件jsapi函数,发送数据给设备sendDataToWXDevice和接收到设备数据onReceiveDataFromWXDevice(目前只支持蓝牙)


html5蓝牙 开发 h5网页读取蓝牙数据_html5蓝牙 开发

html5蓝牙 开发 h5网页读取蓝牙数据_数据_02

第二、发送数据给设备是base64编码,那么编码js方法如下:

/**      


              *  Byte数组转Base64字符,原理同上       


              * @Param [0x00,0x00]      


              * @return Base64字符串      


              **/      


       function        bytes_array_to_base64(array) {      


              if        (array.length == 0) {      


              return        ""       ;      


              }      


              var        b64Chars =        'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/'       ;      


              var        result =        ""       ;      


              // 给末尾添加的字符,先计算出后面的字符      


              var        d3 = array.length % 3;      


              var        endChar =        ""       ;      


              if        (d3 == 1) {      


              var        value = array[array.length - 1];      


              endChar = b64Chars.charAt(value >> 2);      


              endChar += b64Chars.charAt((value << 4) & 0x3F);      


              endChar +=        "=="       ;      


              }        else        if        (d3 == 2) {      


              var        value1 = array[array.length - 2];      


              var        value2 = array[array.length - 1];      


              endChar = b64Chars.charAt(value1 >> 2);      


              endChar += b64Chars.charAt(((value1 << 4) & 0x3F) + (value2 >> 4));      


              endChar += b64Chars.charAt((value2 << 2) & 0x3F);      


              endChar +=        "="       ;      


              }      


              


              var        times = array.length / 3;      


              var        startIndex = 0;      


              // 开始计算      


              for        (       var        i = 0; i < times - (d3 == 0 ? 0 : 1); i++) {      


              startIndex = i * 3;      


              


              var        S1 = array[startIndex + 0];      


              var        S2 = array[startIndex + 1];      


              var        S3 = array[startIndex + 2];      


              


              var        s1 = b64Chars.charAt(S1 >> 2);      


              var        s2 = b64Chars.charAt(((S1 << 4) & 0x3F) + (S2 >> 4));      


              var        s3 = b64Chars.charAt(((S2 & 0xF) << 2) + (S3 >> 6));      


              var        s4 = b64Chars.charAt(S3 & 0x3F);      


              // 添加到结果字符串中      


              result += (s1 + s2 + s3 + s4);      


              }      


              


              return        result + endChar;      


       }


根据微信官方文档说明,我们无论发送什么数据,都要经过base64编码。

发送数据给设备的js代码

/*******************************************************************      


              * 发送数据函数      


              * 作者:V型知识库 www.vxzsk.com 2016-04-04      


              * 入口参数:      


              *     cmdBytes: 需要发送的命令字节      


              *     selDeviceID: 选择的需要发送设备的ID       


              * 出口参数:      


              *     返回: 0表示发送成功;1表示发送失败      


              *     如果成功,则接收事件应该能够收到相应的数据      


       *******************************************************************/      


       function        senddataBytes(cmdBytes,selDeviceID){      


              //1. 如果输入的参数长度为零,则直接退出      


              if       (cmdBytes.length<=0){       return        1};      


              // alert("向微信发送指令数据");      


              //1.1 如果设备ID为空,则直接返回      


              if       (selDeviceID.length<=0){       return        1};      


              //2. 发送数据      


              var        x=0;      


              WeixinJSBridge.invoke(       'sendDataToWXDevice'       , {      


              "deviceId"       :selDeviceID,       


              "base64Data"       :bytes_array_to_base64(cmdBytes)      


              },        function       (res){      


              //alert("向微信发送指令数据返回的状态"+res.err_msg);      


              if       (res.err_msg==       'sendDataToWXDevice:ok'       )      


              {      


              


              x=0;      


              alert(       "数据发送成功"       );      


              }        


              else      


              {      


              


              x=1;       


              alert(       "数据发送失败"       );      


              }       


              });        


              return        x;            


       }


上述代码中有两个alert,此函数会在ios系统下弹出窗口的时候卡死,查阅微信官方文档相关资料获知,此接口的确有卡死状态现象,建议读者不要在ios环境下用alert作为标识。

第三、接收设备数据onReceiveDataFromWXDevice 代码

/*********************************************************      


       * 接收到数据事件      


       * 作者:V型知识库 www.vxzsk.com      


       * my_onReceiveDataFromWXDevice      


       * 入口参数:无      


       * 出口参数:无      


       *********************************************************/       


       function        my_onReceiveDataFromWXDevice(){      


              


              WeixinJSBridge.on(       'onReceiveDataFromWXDevice'       ,        function       (argv) {      


              mlog(       "接收的数据-->"       +argv.base64Data);      

            


              });      


       }


微信官方文档说的已经很清楚了,我们接收到硬件设备返回的数据是base64编码,所以需要我们自己解码,才能识别返回的数据。解码函数请读者自行百度或谷歌,网上例子很多,在这里不在累述。

第四、发送APDU命令数据(16进制)

我们有一节特意说过apdu命令,由于案例设备能识别16进制apdu指令码,所以读者可根据自己的业务替换成相应的apdu命令即可,当然指令也可以是个字符串之类的,我在这里的apdu命令为12345678901122

function        CheckBalance(){      


              var        Bytes=       new        Array();      



              Bytes[0]=0x12;      


              Bytes[1]=0x34;      


              Bytes[2]=0x56;      


      
              Bytes[3]=0x78;      


              Bytes[4]=0x90;      



              Bytes[5]=0x11;      


              Bytes[6]=0x22;      


              return        Bytes;      


              }


把CheckBalance方法16进制数组经过base64编码,调用微信发送数据给设备函数接口即可。

第五、完整jsp代码如下

http://www.vxzsk.com/130.html


1,首先点击获取设备按钮,获得设备的连接

2,点击IC卡复位,触发发送apdu指令函数,向蓝牙硬件设备发送apdu指令数据,并接收到硬件设备返回数据

第六、效果如下图

1,记得一定要在连接上设备的前提下


html5蓝牙 开发 h5网页读取蓝牙数据_d3_03

2,点击获取设备,获得设备的id

html5蓝牙 开发 h5网页读取蓝牙数据_d3_04

3,点击ic卡(cpu接触式卡)复位按钮,日志已经打印出硬件返回的数据了

html5蓝牙 开发 h5网页读取蓝牙数据_数据_05


【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月30日 0

暂无评论

推荐阅读
njkhuebfFFM9