devbox
人工智能uu
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

微信小程序获取蓝牙并实现内容打印_微信小程序 蓝牙打印

作者：人工智能uu | 2024-08-11 18:35:12

赞

踩

微信小程序 蓝牙打印

通过微信小程序如何实现获取蓝牙打印机并实现打印能力，之前做过一个测试Dome，能够获取附近的蓝牙打印机设备并实现打印,今天开放出来供大家参考。

wxml

  1. <!--右下角搜索-->
  2. <view class="ly-cass-box">
  3.     <view class="ly-cass" bindtap="openBluetoothAdapter">
  4.         <image src="/images/search.png" style="width: 70rpx;height: 70rpx;" />
  5.     </view>
  6.     <text class="ly-text">{{ly_text}}</text>
  7. </view>
  8.  
  9.  
  10. <view style="margin: 80rpx 20rpx 30rpx 20rpx;">
  11.     <view class="has-devices-list-container">
  12.         <view class="tip-search">搜索到的设备</view>
  13.         <view class="devices-list">
  14.             <view wx:for="{{devices}}" wx:key="index" class="devices-item">
  15.                 <view style="flex:2">{{item.name? item.name:item.localName}}</view>
  16.                 <button  style="flex:1;" id="{{index}}"  bindtap="_createBLEConnection">连接</button>
  17.             </view>
  18.         </view>
  19.     </view>
  20. </view>

以下图片左侧是布局样式，列表中是扫描出来的附近可以连接的蓝牙设备，右侧是我在一个超市扫描附近的设备后的实际打印效果。PS:实际打印前我已和超市收银员沟通，我在做测试代码实际打印效果，请不要用在未经许可的非法用途。

wxss

  1. /* 搜索 */
  2. .ly-cass-box{
  3.     width: 150rpx;
  4.     height: auto;
  5.     display: flex;
  6.     align-items: center;
  7.     justify-content: center;
  8.     flex-direction: column;
  9.     position: fixed;
  10.     bottom:70rpx;
  11.     right: 50rpx;
  12.     z-index: 500;
  13. }
  14. .ly-cass{
  15.     width: 120rpx;
  16.     height: 120rpx;
  17.     background-color: #f4f4f5;
  18.     border-radius: 50%;
  19.     display: flex;
  20.     align-items: center;
  21.     justify-content: center;
  22. }
  23. .ly-text{
  24.   margin-top: 20rpx;
  25.   background-color: #eee;
  26.   padding: 2rpx 8rpx 2rpx 8rpx;
  27.   border-radius: 6rpx;
  28.   font-size: 25rpx;
  29. }
  30.  
  31.  
  32.  .no-open-gps-tip {
  33.     width: 100%;
  34.     display: flex;
  35.     flex-direction: row;
  36.     align-items: center;
  37.     color: #fa3534;
  38.     font-weight: 400;
  39.     font-size: 30rpx;
  40.     background: rgba(235, 207, 48, 0.8);
  41.     padding: 30rpx;
  42. }
  43. .devices-item {
  44.     width: 100%;
  45.     display: flex;
  46.     justify-content: space-between;
  47.     margin-top: 20rpx;
  48.     align-items: flex-end;
  49.     padding-bottom: 5rpx;
  50.     border-bottom: 1px solid #f4f4f5;
  51. }
  52.  
  53. .devices-list {
  54.     width: 100%;
  55.     padding: 0 20rpx;
  56.     display: flex;
  57.     flex-direction: column;
  58.  
  59. }
  60.  
  61. .tip-search {
  62.     width: 100%;
  63.     margin: 20rpx 0;
  64.     text-align: left;
  65.     font-size: 16px;
  66.     color: #2979ff;
  67. }
  68.  
  69. .has-devices-list-container {
  70.     width: 100%;
  71.     display: flex;
  72.     flex-direction: column;
  73.     margin: 30rpx 0;
  74. }
  75.  
  76.

这是我刚开发上线的的两个小游戏，欢迎大家扫码体验！

 以上两个《蛇王传说》《番茄花园》已上线微信/抖音平台运营。

《番茄花园》游戏源码已上架Cocos Store 商店，欢迎围观！Cocos StoreCocos商城 Creator扩展icon-default.png?t=N7T8https://store.cocos.com/app/detail/6122

js

  1. const LAST_CONNECTED_DEVICE = 'last_connected_device';
  2. const PrinterJobs = require('../../printer/printerjobs');
  3. const printerUtil = require('../../printer/printerutil');
  4. Page({
  5.     data: {
  6.         ly_text: "点击搜索",
  7.         connected_ly: false, //蓝牙按钮是否显示
  8.         blue_list_ly: false, //蓝牙连接列表显示
  9.         discoveryStarted: false,
  10.         devices: [], //已发现的蓝牙设备列表
  11.         name: '', //已连接的设备名称
  12.         deviceId: '', //已连接的设备deviceId
  13.         chs: [],
  14.         canWrite: false,
  15.  
  16.     },
  17.  
  18.     /**
  19.      * 第一步 判断初始化蓝牙模块是否可用
  20.      */
  21.     openBluetoothAdapter() {
  22.         if (!wx.openBluetoothAdapter) {
  23.             wx.showModal({
  24.                 title: '提示',
  25.                 content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
  26.             })
  27.             return
  28.         }
  29.         this.openBluetoothAdapters()
  30.     },
  31.     /**
  32.      * 第二步 初始化蓝牙模块
  33.      */
  34.     openBluetoothAdapters() {
  35.         this.setData({
  36.             ly_text: '搜索设备中'
  37.         })
  38.         wx.openBluetoothAdapter({ //请求打开蓝牙情况
  39.             success: res => {
  40.                 //console.log('初始化蓝牙模块->res:', res)
  41.                 this.startBluetoothDevicesDiscovery(); //打开蓝牙后 开始搜索
  42.             },
  43.             fail: err => {
  44.                 console.log('初始化蓝牙模块->err:', err)
  45.                 // 错误码	错误信息	说明
  46.                 // 0	ok	正常
  47.                 // -1	already connect	已连接
  48.                 // 10000	not init	未初始化蓝牙适配器
  49.                 // 10001	not available	当前蓝牙适配器不可用
  50.                 // 10002	no device	没有找到指定设备
  51.                 // 10003	connection fail	连接失败
  52.                 // 10004	no service	没有找到指定服务
  53.                 // 10005	no characteristic	没有找到指定特征
  54.                 // 10006	no connection	当前连接已断开
  55.                 // 10007	property not support	当前特征不支持此操作
  56.                 // 10008	system error	其余所有系统上报的异常
  57.                 // 10009	system not support	Android 系统特有，系统版本低于 4.3 不支持 BLE
  58.                 // 10012	operate time out	连接超时
  59.                 // 10013	invalid_data	连接 deviceId 为空或者是格式不正确
  60.                 // object.fail 回调函数返回的 state 参数（仅 iOS）
  61.                 // 状态码	说明
  62.                 // 0	未知
  63.                 // 1	重置中
  64.                 // 2	不支持
  65.                 // 3	未授权
  66.                 // 4	未开启
  67.                 if (err.errCode === 10001) { //10001 当前蓝牙适配器不可用
  68.                     wx.showModal({
  69.                         title: '错误',
  70.                         content: '当前蓝牙适配器不可用，请打开手机蓝牙后重试！',
  71.                         showCancel: false
  72.                     });
  73.                     //监听蓝牙适配器状态变化事件
  74.                     wx.onBluetoothAdapterStateChange(res => {
  75.                         console.log('蓝牙适配器是否可用->res:', res);
  76.                         if (res.available) { //available=true 蓝牙适配器可用
  77.                             wx.onBluetoothAdapterStateChange(() => {});
  78.                             this.startBluetoothDevicesDiscovery();
  79.                         }
  80.                     })
  81.                 } else {
  82.                     wx.showModal({
  83.                         title: '错误',
  84.                         content: `错误码:[${err.errCode}] 错误信息:[${err.errMsg}]`,
  85.                         showCancel: false
  86.                     });
  87.                 }
  88.             }
  89.         });
  90.     },
  91.     /** 
  92.      * 第三步 开始搜寻附近的蓝牙外围设备
  93.      */
  94.     startBluetoothDevicesDiscovery() {
  95.         this.data.discoveryStarted = true
  96.         wx.startBluetoothDevicesDiscovery({
  97.             success: res => {
  98.                 console.log('开始搜寻附近的蓝牙外围设备->res', res)
  99.                 this.onBluetoothDeviceFound(); //蓝牙搜索成功后监听搜索
  100.             },
  101.             fail: (err) => {
  102.                 console.log('开始搜寻附近的蓝牙外围设备->err', err)
  103.             }
  104.         })
  105.     },
  106.  
  107.     /**
  108.      * 第四步 监听搜索到新设备的事件
  109.      */
  110.     onBluetoothDeviceFound() {
  111.         wx.onBluetoothDeviceFound(res => {
  112.             res.devices.forEach(device => {
  113.                 if (!device.name && !device.localName) {
  114.                     return
  115.                 }
  116.                 let foundDevices = this.data.devices || []
  117.                 let idx = this.inArray(foundDevices, 'deviceId', device.deviceId);
  118.                 if (idx === -1) {
  119.                     this.data.devices.push(device);
  120.                     console.log('发现新设备：', device); //添加新设备
  121.                 } else {
  122.                     this.data.devices[idx] = device; //更新设备数据
  123.                 }
  124.             })
  125.             if (this.data.devices.length >= 1) {
  126.                 this.setData({
  127.                     blue_list_ly: true,
  128.                     ly_text: '发现设备'
  129.                 })
  130.  
  131.             } else {
  132.                 this.setData({
  133.                     ly_text: '未发现设备'
  134.                 })
  135.             }
  136.             this.setData({
  137.                 devices: this.data.devices
  138.             })
  139.         })
  140.     },
  141.     /**
  142.      * 第五步 连接蓝牙低功耗设备
  143.      * @param {手动点击连接蓝牙事件}
  144.      * @param {创建连接蓝牙}
  145.      * @param {如果已经连接过可直接连接}
  146.      */
  147.     _createBLEConnection(e) {
  148.         let idx = e.currentTarget.id
  149.         let name = this.data.devices[idx].name
  150.         let deviceId = this.data.devices[idx].deviceId
  151.         this.setData({
  152.             name,
  153.             deviceId
  154.         })
  155.         console.log(name)
  156.         //连接蓝牙低功耗设备。
  157.         // 若小程序在之前已有搜索过某个蓝牙设备，并成功建立连接，可直接传入之前搜索获取的 deviceId 直接尝试连接该设备，无需再次进行搜索操作
  158.         wx.createBLEConnection({
  159.             deviceId,
  160.             success: (res) => {
  161.                 console.log('连接蓝牙低功耗设备->res：', res);
  162.                 this.setData({
  163.                     blue_list_ly: false,
  164.                     connected_ly: true,
  165.                     ly_text: '已连接'
  166.                 })
  167.                 //获取蓝牙->保存到缓存
  168.                 this.getBLEDeviceServices(deviceId);
  169.                 wx.setStorage({
  170.                     key: LAST_CONNECTED_DEVICE,
  171.                     data: {
  172.                         name,
  173.                         deviceId
  174.                     }
  175.                 })
  176.             },
  177.             fail: (err) => {
  178.                 console.log('连接蓝牙低功耗设备->err', err.errno);
  179.                 this.setData({
  180.                     connected_ly: false,
  181.                     ly_text: '连接失败'
  182.                 })
  183.             }
  184.         })
  185.         this.stopBluetoothDevicesDiscovery();
  186.     },
  187.     /**
  188.      * 第六步 停止搜寻附近的蓝牙外围设备
  189.      * @param {蓝牙连接成功关闭监听搜索}
  190.      * @param {蓝牙搜索比较消耗资源}
  191.      */
  192.     stopBluetoothDevicesDiscovery() {
  193.         wx.stopBluetoothDevicesDiscovery({
  194.             complete: () => {
  195.                 console.log('停')
  196.                 this.data.discoveryStarted = false
  197.             }
  198.         })
  199.     },
  200.     /**
  201.      * 第七步 断开与蓝牙低功耗设备的连接
  202.      * @param {蓝牙连接成功关闭搜索}
  203.      * @param {功能}
  204.      */
  205.     closeBLEConnection(e) {
  206.         wx.closeBLEConnection({
  207.             deviceId: e.deviceId
  208.         })
  209.         this.connected_ly = false;
  210.     },
  211.     /**
  212.      * 第八步  获取蓝牙低功耗设备所有服务
  213.      * @param {蓝牙功能查询}
  214.      * @param {蓝牙连接成功后}
  215.      * @param {找到主要服务功能}
  216.      */
  217.     getBLEDeviceServices(deviceId) {
  218.         wx.getBLEDeviceServices({
  219.             deviceId,
  220.             success: (res) => {
  221.                 for (let i = 0; i < res.services?.length; i++) {
  222.                     //该服务是否为主服务
  223.                     if (res.services[i].isPrimary) {
  224.                         this.getBLEDeviceCharacteristics(deviceId, res.services[i].uuid);
  225.                         return
  226.                     }
  227.                 }
  228.             }
  229.         })
  230.     },
  231.     /**
  232.      * 第九步 获取蓝牙低功耗设备某个服务中所有特征 
  233.      * @param {蓝牙功能特征查询}
  234.      * @param {主要功能的特性}
  235.      * @param {找到主要服务功能的特征}
  236.      * @param {到此步骤连接结束}
  237.      */
  238.     getBLEDeviceCharacteristics(deviceId, serviceId) {
  239.         //获取蓝牙低功耗设备某个服务中所有特征 (characteristic)
  240.         // read	boolean	该特征是否支持 read 操作
  241.         // write	boolean	该特征是否支持 write 操作
  242.         // notify	boolean	该特征是否支持 notify 操作
  243.         // indicate	boolean	该特征是否支持 indicate 操作
  244.         // writeNoResponse	boolean	该特征是否支持无回复写操作
  245.         // writeDefault	boolean	该特征是否支持有回复写操作
  246.         let name = this.data.name
  247.         wx.getBLEDeviceCharacteristics({
  248.             deviceId,
  249.             serviceId,
  250.             success: res => {
  251.                 console.log('获取蓝牙低功耗设备某个服务中所有特征 (characteristic)->res:', res)
  252.                 for (let i = 0; i < res.characteristics?.length; i++) {
  253.                     const item = res.characteristics[i]
  254.                     if (item.properties.write) {
  255.                         this.setData({
  256.                             canWrite: true
  257.                         })
  258.                         console.log('可以连接')
  259.                         this._deviceId = deviceId
  260.                         this._serviceId = serviceId
  261.                         this._characteristicId = item.uuid
  262.                         wx.setStorage({
  263.                             key: "BlueKey",
  264.                             data: {
  265.                                 _close: true,
  266.                                 _name: name,
  267.                                 _deviceId: deviceId,
  268.                                 _serviceId: serviceId,
  269.                                 _characteristicId: item.uuid,
  270.                             }
  271.                         })
  272.                         //pring
  273.  
  274.                         this.writeBLECharacteristicValue()
  275.                         break;
  276.                     }
  277.                 }
  278.                 setTimeout(() => {
  279.                     if (this.data.canWrite) {
  280.                         this.setData({
  281.                             connected_ly: true,
  282.                             ly_text: '已连接'
  283.                         })
  284.  
  285.                     } else {
  286.                         wx.showToast({
  287.                             icon: 'error',
  288.                             title: '您当前选择的设备不支持打印功能，请重新选择！',
  289.                             duration: 3000
  290.                         })
  291.                     }
  292.                 }, 1000)
  293.             },
  294.             fail: (res) => {
  295.                 console.error('获取蓝牙特征失败', res)
  296.             }
  297.         })
  298.     },
  299.     /**
  300.      * 第十步 编写蓝牙需要打印的内容
  301.      * @param {编写蓝牙需要打印的内容}
  302.      * @param {打印按钮的事件}
  303.      * @param {打印功能前准备}
  304.      */
  305.     writeBLECharacteristicValue() {
  306.         let pd = {
  307.             client: '测试',
  308.             name: '张三',
  309.             sex: '男',
  310.             iPhone: '18888888888',
  311.             idcard: '888888888888888888',
  312.         }
  313.         var that = this
  314.         setTimeout(() => {
  315.             let printerJobs = new PrinterJobs();
  316.             let dayun1 = '打印机自检' + pd?.contactinfo?.client + '\r\n' +
  317.                 '姓名：' + pd?.name + '\r\n' +
  318.                 '性别：' + pd?.sex + '\r\n' +
  319.                 '联系方式：' + pd?.iPhone + '\r\n' +
  320.                 '身份证号码：' + pd?.idcard + '\r\n'
  321.  
  322.             printerJobs
  323.                 .setSize(2, 2)
  324.                 .setAlign('CT')
  325.                 .print('! 0 100 203 100 1\r\n法决定书\r\nPRINT\r\n')
  326.                 .setSize(1, 1).setAlign('LT')
  327.                 .print(dayun1)
  328.  
  329.  
  330.  
  331.             let buffer = printerJobs.buffer();
  332.             // console.log('ArrayBuffer', 'length: ' + buffer.byteLength, ' hex: ' + this.ab2hex(
  333.             // 	buffer));
  334.             // 1.并行调用多次会存在写失败的可能性
  335.             // 2.建议每次写入不超过20字节
  336.             // 分包处理，延时调用
  337.             const maxChunk = 20;
  338.             const delay = 20;
  339.             for (let i = 0, j = 0, length = buffer.byteLength; i < length; i += maxChunk, j++) {
  340.                 let subPackage = buffer.slice(i, i + maxChunk <= length ? (i + maxChunk) : length);
  341.                 setTimeout(this._writeBLECharacteristicValue, j * delay, subPackage);
  342.             }
  343.  
  344.             // this.lanyardShow = false;
  345.             // this.$refs.uUpload.clear();
  346.            // this.clearFormData();
  347.             wx.showToast({
  348.                 title: '打印成功',
  349.                 icon: 'success'
  350.             })
  351.         }, 5000)
  352.  
  353.     },
  354.  
  355.     /**
  356.      * 第十一步
  357.      * @param {最终的打印}
  358.      * @param {由第十步骤调用}
  359.      * @param {轮询打印}
  360.      * @param {打印机输出}
  361.      * @param {打印结束}
  362.      */
  363.     _writeBLECharacteristicValue(buffer) {
  364.         wx.writeBLECharacteristicValue({
  365.             deviceId: this._deviceId,
  366.             serviceId: this._serviceId,
  367.             characteristicId: this._characteristicId,
  368.             value: buffer,
  369.             success(res) {
  370.                 console.log('打印成功->res:', res)
  371.             },
  372.             fail(res) {
  373.                 console.log('打印失败', res)
  374.             }
  375.         })
  376.     },
  377.  
  378.  
  379.  
  380.  
  381.     /**
  382.      * 第十二步
  383.      * @param {蓝牙相关事件}
  384.      * @param {和以上打印不衔接}
  385.      * @param {关闭蓝牙}
  386.      */
  387.     closeBluetoothAdapter() {
  388.         wx.closeBluetoothAdapter()
  389.         this.data.discoveryStarted = false
  390.     },
  391.  
  392.     /**
  393.      * 第十三步
  394.      * @param {判断蓝牙是否已经连接}
  395.      * @param {只支持wx. 不支持wx.}
  396.      * @param {只支持安卓, 不支持苹果}
  397.      */
  398.     isBluetoothDevicePaired() {
  399.         var that = this
  400.         wx.isBluetoothDevicePaired({
  401.             deviceId: wx.getStorageSync("BlueKey")?._deviceId,
  402.             success(res) {
  403.                 console.log(res, "判断连接成功")
  404.                 that.setData({
  405.                     connected_ly: true,
  406.                     ly_text: '连接成功'
  407.                 })
  408.  
  409.             },
  410.             fail(err) {
  411.                 console.log(err, "判断连接失败");
  412.                 that.setData({
  413.                     ly_text: '点击搜索'
  414.                 })
  415.  
  416.             }
  417.         })
  418.  
  419.     },
  420.     /**
  421.      * 第十四步
  422.      * @param {蓝牙相关资源事件}
  423.      * @param {搜索 资源 打印}
  424.      * @param {转换}
  425.      */
  426.     inArray(arr, key, val) {
  427.         for (let i = 0; i < arr.length; i++) {
  428.             if (arr[i][key] === val) {
  429.                 return i
  430.             }
  431.         }
  432.         return -1
  433.     },
  434.     ab2hex(buffer) { // ArrayBuffer转16进度字符串示例
  435.         const hexArr = Array.prototype.map.call(
  436.             new Uint8Array(buffer),
  437.             function (bit) {
  438.                 return ('00' + bit.toString(16)).slice(-2)
  439.             }
  440.         )
  441.         return hexArr.join(',')
  442.     },
  443.     str2ab(str) {
  444.         let buffer = new ArrayBuffer(str?.length)
  445.         let dataView = new DataView(buffer)
  446.         for (let i = 0; i < str?.length; i++) {
  447.             dataView.setUint8(i, str?.charAt(i).charCodeAt(0))
  448.         }
  449.         return buffer;
  450.     },
  451.     /**
  452.      * 第十五步
  453.      * @param {进入页面就自动连接}
  454.      * @param {该方法存在BUG}
  455.      * @param {目前该方法先不投放使用}
  456.      */
  457.     createBLEConnectionWithDeviceId(e) {
  458.         //创建蓝牙链接
  459.         wx.openBluetoothAdapter({
  460.             success: (res) => {
  461.                 let ly_data = {
  462.                     name: wx.getStorageSync("BlueKey")?._deviceId,
  463.                     deviceId: wx.getStorageSync("BlueKey")?._name
  464.                 }
  465.                 this._createBLEConnection(ly_data);
  466.             },
  467.             fail: (res) => {
  468.                 if (res.errCode === 10001) {
  469.                     wx.showModal({
  470.                         title: '错误',
  471.                         content: '未找到蓝牙设备, 请打开蓝牙后重试。',
  472.                         showCancel: false
  473.                     });
  474.                     this.connected_ly = false
  475.                 } else if (res.errCode === -1 || res.errCode === 10010) { //已连接
  476.                     this.data.connected_ly = true;
  477.                 }
  478.             }
  479.         })
  480.     },
  481.  
  482.     /**
  483.      * 第十六步
  484.      * @param {获取蓝牙适配状态}
  485.      * @param {在蓝牙连接成功后调用查看}
  486.      * @param {判断连接用}
  487.      */
  488.     getBluetoothAdapterState() {
  489.         wx.getBluetoothAdapterState({
  490.             success: (res) => {
  491.                 console.log(res)
  492.                 if (res.available) {
  493.                     this.data.connected_ly = true
  494.                     this.data.ly_text = "已连接"
  495.                     console.log("蓝牙已经连接", res)
  496.                 } else {
  497.                     this.connected_ly = false;
  498.                     this.data.ly_text = "点击连接"
  499.                     console.log("蓝牙已经断开")
  500.                 }
  501.             }
  502.         })
  503.     },
  504.  
  505. })

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/人工智能uu/article/detail/965535
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号