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

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

wxml

<!--右下角搜索-->
<view class="ly-cass-box">
    <view class="ly-cass" bindtap="openBluetoothAdapter">
        <image src="/images/search.png" style="width: 70rpx;height: 70rpx;" />
    </view>
    <text class="ly-text">{{ly_text}}</text>
</view>


<view style="margin: 80rpx 20rpx 30rpx 20rpx;">
    <view class="has-devices-list-container">
        <view class="tip-search">搜索到的设备</view>
        <view class="devices-list">
            <view wx:for="{{devices}}" wx:key="index" class="devices-item">
                <view style="flex:2">{{item.name? item.name:item.localName}}</view>
                <button  style="flex:1;" id="{{index}}"  bindtap="_createBLEConnection">连接</button>
            </view>
        </view>
    </view>
</view>

wxss

  • /* 搜索 */
    .ly-cass-box{
        width: 150rpx;
        height: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        position: fixed;
        bottom:70rpx;
        right: 50rpx;
        z-index: 500;
    }
    .ly-cass{
        width: 120rpx;
        height: 120rpx;
        background-color: #f4f4f5;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .ly-text{
      margin-top: 20rpx;
      background-color: #eee;
      padding: 2rpx 8rpx 2rpx 8rpx;
      border-radius: 6rpx;
      font-size: 25rpx;
    }
    
    
     .no-open-gps-tip {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        color: #fa3534;
        font-weight: 400;
        font-size: 30rpx;
        background: rgba(235, 207, 48, 0.8);
        padding: 30rpx;
    }
    .devices-item {
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin-top: 20rpx;
        align-items: flex-end;
        padding-bottom: 5rpx;
        border-bottom: 1px solid #f4f4f5;
    }
    
    .devices-list {
        width: 100%;
        padding: 0 20rpx;
        display: flex;
        flex-direction: column;
    
    }
    
    .tip-search {
        width: 100%;
        margin: 20rpx 0;
        text-align: left;
        font-size: 16px;
        color: #2979ff;
    }
    
    .has-devices-list-container {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin: 30rpx 0;
    }
    
    
    

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

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

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

js

const LAST_CONNECTED_DEVICE = 'last_connected_device';
const PrinterJobs = require('../../printer/printerjobs');
const printerUtil = require('../../printer/printerutil');
Page({
    data: {
        ly_text: "点击搜索",
        connected_ly: false, //蓝牙按钮是否显示
        blue_list_ly: false, //蓝牙连接列表显示
        discoveryStarted: false,
        devices: [], //已发现的蓝牙设备列表
        name: '', //已连接的设备名称
        deviceId: '', //已连接的设备deviceId
        chs: [],
        canWrite: false,

    },

    /**
     * 第一步 判断初始化蓝牙模块是否可用
     */
    openBluetoothAdapter() {
        if (!wx.openBluetoothAdapter) {
            wx.showModal({
                title: '提示',
                content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
            })
            return
        }
        this.openBluetoothAdapters()
    },
    /**
     * 第二步 初始化蓝牙模块
     */
    openBluetoothAdapters() {
        this.setData({
            ly_text: '搜索设备中'
        })
        wx.openBluetoothAdapter({ //请求打开蓝牙情况
            success: res => {
                //console.log('初始化蓝牙模块->res:', res)
                this.startBluetoothDevicesDiscovery(); //打开蓝牙后 开始搜索
            },
            fail: err => {
                console.log('初始化蓝牙模块->err:', err)
                // 错误码	错误信息	说明
                // 0	ok	正常
                // -1	already connect	已连接
                // 10000	not init	未初始化蓝牙适配器
                // 10001	not available	当前蓝牙适配器不可用
                // 10002	no device	没有找到指定设备
                // 10003	connection fail	连接失败
                // 10004	no service	没有找到指定服务
                // 10005	no characteristic	没有找到指定特征
                // 10006	no connection	当前连接已断开
                // 10007	property not support	当前特征不支持此操作
                // 10008	system error	其余所有系统上报的异常
                // 10009	system not support	Android 系统特有,系统版本低于 4.3 不支持 BLE
                // 10012	operate time out	连接超时
                // 10013	invalid_data	连接 deviceId 为空或者是格式不正确
                // object.fail 回调函数返回的 state 参数(仅 iOS)
                // 状态码	说明
                // 0	未知
                // 1	重置中
                // 2	不支持
                // 3	未授权
                // 4	未开启
                if (err.errCode === 10001) { //10001 当前蓝牙适配器不可用
                    wx.showModal({
                        title: '错误',
                        content: '当前蓝牙适配器不可用,请打开手机蓝牙后重试!',
                        showCancel: false
                    });
                    //监听蓝牙适配器状态变化事件
                    wx.onBluetoothAdapterStateChange(res => {
                        console.log('蓝牙适配器是否可用->res:', res);
                        if (res.available) { //available=true 蓝牙适配器可用
                            wx.onBluetoothAdapterStateChange(() => {});
                            this.startBluetoothDevicesDiscovery();
                        }
                    })
                } else {
                    wx.showModal({
                        title: '错误',
                        content: `错误码:[${err.errCode}] 错误信息:[${err.errMsg}]`,
                        showCancel: false
                    });
                }
            }
        });
    },
    /** 
     * 第三步 开始搜寻附近的蓝牙外围设备
     */
    startBluetoothDevicesDiscovery() {
        this.data.discoveryStarted = true
        wx.startBluetoothDevicesDiscovery({
            success: res => {
                console.log('开始搜寻附近的蓝牙外围设备->res', res)
                this.onBluetoothDeviceFound(); //蓝牙搜索成功后监听搜索
            },
            fail: (err) => {
                console.log('开始搜寻附近的蓝牙外围设备->err', err)
            }
        })
    },

    /**
     * 第四步 监听搜索到新设备的事件
     */
    onBluetoothDeviceFound() {
        wx.onBluetoothDeviceFound(res => {
            res.devices.forEach(device => {
                if (!device.name && !device.localName) {
                    return
                }
                let foundDevices = this.data.devices || []
                let idx = this.inArray(foundDevices, 'deviceId', device.deviceId);
                if (idx === -1) {
                    this.data.devices.push(device);
                    console.log('发现新设备:', device); //添加新设备
                } else {
                    this.data.devices[idx] = device; //更新设备数据
                }
            })
            if (this.data.devices.length >= 1) {
                this.setData({
                    blue_list_ly: true,
                    ly_text: '发现设备'
                })

            } else {
                this.setData({
                    ly_text: '未发现设备'
                })
            }
            this.setData({
                devices: this.data.devices
            })
        })
    },
    /**
     * 第五步 连接蓝牙低功耗设备
     * @param {手动点击连接蓝牙事件}
     * @param {创建连接蓝牙}
     * @param {如果已经连接过可直接连接}
     */
    _createBLEConnection(e) {
        let idx = e.currentTarget.id
        let name = this.data.devices[idx].name
        let deviceId = this.data.devices[idx].deviceId
        this.setData({
            name,
            deviceId
        })
        console.log(name)
        //连接蓝牙低功耗设备。
        // 若小程序在之前已有搜索过某个蓝牙设备,并成功建立连接,可直接传入之前搜索获取的 deviceId 直接尝试连接该设备,无需再次进行搜索操作
        wx.createBLEConnection({
            deviceId,
            success: (res) => {
                console.log('连接蓝牙低功耗设备->res:', res);
                this.setData({
                    blue_list_ly: false,
                    connected_ly: true,
                    ly_text: '已连接'
                })
                //获取蓝牙->保存到缓存
                this.getBLEDeviceServices(deviceId);
                wx.setStorage({
                    key: LAST_CONNECTED_DEVICE,
                    data: {
                        name,
                        deviceId
                    }
                })
            },
            fail: (err) => {
                console.log('连接蓝牙低功耗设备->err', err.errno);
                this.setData({
                    connected_ly: false,
                    ly_text: '连接失败'
                })
            }
        })
        this.stopBluetoothDevicesDiscovery();
    },
    /**
     * 第六步 停止搜寻附近的蓝牙外围设备
     * @param {蓝牙连接成功关闭监听搜索}
     * @param {蓝牙搜索比较消耗资源}
     */
    stopBluetoothDevicesDiscovery() {
        wx.stopBluetoothDevicesDiscovery({
            complete: () => {
                console.log('停')
                this.data.discoveryStarted = false
            }
        })
    },
    /**
     * 第七步 断开与蓝牙低功耗设备的连接
     * @param {蓝牙连接成功关闭搜索}
     * @param {功能}
     */
    closeBLEConnection(e) {
        wx.closeBLEConnection({
            deviceId: e.deviceId
        })
        this.connected_ly = false;
    },
    /**
     * 第八步  获取蓝牙低功耗设备所有服务
     * @param {蓝牙功能查询}
     * @param {蓝牙连接成功后}
     * @param {找到主要服务功能}
     */
    getBLEDeviceServices(deviceId) {
        wx.getBLEDeviceServices({
            deviceId,
            success: (res) => {
                for (let i = 0; i < res.services?.length; i++) {
                    //该服务是否为主服务
                    if (res.services[i].isPrimary) {
                        this.getBLEDeviceCharacteristics(deviceId, res.services[i].uuid);
                        return
                    }
                }
            }
        })
    },
    /**
     * 第九步 获取蓝牙低功耗设备某个服务中所有特征 
     * @param {蓝牙功能特征查询}
     * @param {主要功能的特性}
     * @param {找到主要服务功能的特征}
     * @param {到此步骤连接结束}
     */
    getBLEDeviceCharacteristics(deviceId, serviceId) {
        //获取蓝牙低功耗设备某个服务中所有特征 (characteristic)
        // read	boolean	该特征是否支持 read 操作
        // write	boolean	该特征是否支持 write 操作
        // notify	boolean	该特征是否支持 notify 操作
        // indicate	boolean	该特征是否支持 indicate 操作
        // writeNoResponse	boolean	该特征是否支持无回复写操作
        // writeDefault	boolean	该特征是否支持有回复写操作
        let name = this.data.name
        wx.getBLEDeviceCharacteristics({
            deviceId,
            serviceId,
            success: res => {
                console.log('获取蓝牙低功耗设备某个服务中所有特征 (characteristic)->res:', res)
                for (let i = 0; i < res.characteristics?.length; i++) {
                    const item = res.characteristics[i]
                    if (item.properties.write) {
                        this.setData({
                            canWrite: true
                        })
                        console.log('可以连接')
                        this._deviceId = deviceId
                        this._serviceId = serviceId
                        this._characteristicId = item.uuid
                        wx.setStorage({
                            key: "BlueKey",
                            data: {
                                _close: true,
                                _name: name,
                                _deviceId: deviceId,
                                _serviceId: serviceId,
                                _characteristicId: item.uuid,
                            }
                        })
                        //pring

                        this.writeBLECharacteristicValue()
                        break;
                    }
                }
                setTimeout(() => {
                    if (this.data.canWrite) {
                        this.setData({
                            connected_ly: true,
                            ly_text: '已连接'
                        })

                    } else {
                        wx.showToast({
                            icon: 'error',
                            title: '您当前选择的设备不支持打印功能,请重新选择!',
                            duration: 3000
                        })
                    }
                }, 1000)
            },
            fail: (res) => {
                console.error('获取蓝牙特征失败', res)
            }
        })
    },
    /**
     * 第十步 编写蓝牙需要打印的内容
     * @param {编写蓝牙需要打印的内容}
     * @param {打印按钮的事件}
     * @param {打印功能前准备}
     */
    writeBLECharacteristicValue() {
        let pd = {
            client: '测试',
            name: '张三',
            sex: '男',
            iPhone: '18888888888',
            idcard: '888888888888888888',
        }
        var that = this
        setTimeout(() => {
            let printerJobs = new PrinterJobs();
            let dayun1 = '打印机自检' + pd?.contactinfo?.client + '\r\n' +
                '姓名:' + pd?.name + '\r\n' +
                '性别:' + pd?.sex + '\r\n' +
                '联系方式:' + pd?.iPhone + '\r\n' +
                '身份证号码:' + pd?.idcard + '\r\n'

            printerJobs
                .setSize(2, 2)
                .setAlign('CT')
                .print('! 0 100 203 100 1\r\n法决定书\r\nPRINT\r\n')
                .setSize(1, 1).setAlign('LT')
                .print(dayun1)



            let buffer = printerJobs.buffer();
            // console.log('ArrayBuffer', 'length: ' + buffer.byteLength, ' hex: ' + this.ab2hex(
            // 	buffer));
            // 1.并行调用多次会存在写失败的可能性
            // 2.建议每次写入不超过20字节
            // 分包处理,延时调用
            const maxChunk = 20;
            const delay = 20;
            for (let i = 0, j = 0, length = buffer.byteLength; i < length; i += maxChunk, j++) {
                let subPackage = buffer.slice(i, i + maxChunk <= length ? (i + maxChunk) : length);
                setTimeout(this._writeBLECharacteristicValue, j * delay, subPackage);
            }

            // this.lanyardShow = false;
            // this.$refs.uUpload.clear();
           // this.clearFormData();
            wx.showToast({
                title: '打印成功',
                icon: 'success'
            })
        }, 5000)

    },

    /**
     * 第十一步
     * @param {最终的打印}
     * @param {由第十步骤调用}
     * @param {轮询打印}
     * @param {打印机输出}
     * @param {打印结束}
     */
    _writeBLECharacteristicValue(buffer) {
        wx.writeBLECharacteristicValue({
            deviceId: this._deviceId,
            serviceId: this._serviceId,
            characteristicId: this._characteristicId,
            value: buffer,
            success(res) {
                console.log('打印成功->res:', res)
            },
            fail(res) {
                console.log('打印失败', res)
            }
        })
    },




    /**
     * 第十二步
     * @param {蓝牙相关事件}
     * @param {和以上打印不衔接}
     * @param {关闭蓝牙}
     */
    closeBluetoothAdapter() {
        wx.closeBluetoothAdapter()
        this.data.discoveryStarted = false
    },

    /**
     * 第十三步
     * @param {判断蓝牙是否已经连接}
     * @param {只支持wx. 不支持wx.}
     * @param {只支持安卓, 不支持苹果}
     */
    isBluetoothDevicePaired() {
        var that = this
        wx.isBluetoothDevicePaired({
            deviceId: wx.getStorageSync("BlueKey")?._deviceId,
            success(res) {
                console.log(res, "判断连接成功")
                that.setData({
                    connected_ly: true,
                    ly_text: '连接成功'
                })

            },
            fail(err) {
                console.log(err, "判断连接失败");
                that.setData({
                    ly_text: '点击搜索'
                })

            }
        })

    },
    /**
     * 第十四步
     * @param {蓝牙相关资源事件}
     * @param {搜索 资源 打印}
     * @param {转换}
     */
    inArray(arr, key, val) {
        for (let i = 0; i < arr.length; i++) {
            if (arr[i][key] === val) {
                return i
            }
        }
        return -1
    },
    ab2hex(buffer) { // ArrayBuffer转16进度字符串示例
        const hexArr = Array.prototype.map.call(
            new Uint8Array(buffer),
            function (bit) {
                return ('00' + bit.toString(16)).slice(-2)
            }
        )
        return hexArr.join(',')
    },
    str2ab(str) {
        let buffer = new ArrayBuffer(str?.length)
        let dataView = new DataView(buffer)
        for (let i = 0; i < str?.length; i++) {
            dataView.setUint8(i, str?.charAt(i).charCodeAt(0))
        }
        return buffer;
    },
    /**
     * 第十五步
     * @param {进入页面就自动连接}
     * @param {该方法存在BUG}
     * @param {目前该方法先不投放使用}
     */
    createBLEConnectionWithDeviceId(e) {
        //创建蓝牙链接
        wx.openBluetoothAdapter({
            success: (res) => {
                let ly_data = {
                    name: wx.getStorageSync("BlueKey")?._deviceId,
                    deviceId: wx.getStorageSync("BlueKey")?._name
                }
                this._createBLEConnection(ly_data);
            },
            fail: (res) => {
                if (res.errCode === 10001) {
                    wx.showModal({
                        title: '错误',
                        content: '未找到蓝牙设备, 请打开蓝牙后重试。',
                        showCancel: false
                    });
                    this.connected_ly = false
                } else if (res.errCode === -1 || res.errCode === 10010) { //已连接
                    this.data.connected_ly = true;
                }
            }
        })
    },

    /**
     * 第十六步
     * @param {获取蓝牙适配状态}
     * @param {在蓝牙连接成功后调用查看}
     * @param {判断连接用}
     */
    getBluetoothAdapterState() {
        wx.getBluetoothAdapterState({
            success: (res) => {
                console.log(res)
                if (res.available) {
                    this.data.connected_ly = true
                    this.data.ly_text = "已连接"
                    console.log("蓝牙已经连接", res)
                } else {
                    this.connected_ly = false;
                    this.data.ly_text = "点击连接"
                    console.log("蓝牙已经断开")
                }
            }
        })
    },

})

  • 6
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: UIApp微信小程序蓝牙批量打印设置提供了简便的方式来配置和管理蓝牙打印设备。通过这个设置,用户可以轻松地连接和操作多个蓝牙打印机。 首先,在UIApp微信小程序中,用户可以点击设置菜单进入蓝牙打印设置页面。在该页面上,用户可以看到已经连接的蓝牙打印机列表,并可以选择连接新的打印机。 用户可以通过点击搜索按钮来扫描周围的蓝牙设备。一旦找到了需要连接的打印机,用户可以点击该设备并输入密码(如果需要)进行连接。连接成功后,打印机将会在已连接设备列表中显示。 在已连接设备列表中,用户可以选择默认打印机。默认打印机将是用户首选的打印设备,在用户不指定打印机时将自动选择该设备进行打印。 UIApp提供了多种打印设置选项供用户选择。用户可以根据需要设置打印机的纸张大小、页面方向、打印质量等参数。此外,用户还可以选择打印多份、打印双面等功能。 通过这个蓝牙批量打印设置,用户可以方便地管理和配置多个蓝牙打印设备,提高打印效率。无论是在家庭环境还是办公场所,UIApp微信小程序蓝牙批量打印设置都将为用户提供便捷的打印操作体验。 ### 回答2: 要在UIapp微信小程序中设置蓝牙批量打印,首先需要确保小程序已经获取蓝牙权限。接下来,我们需要使用微信小程序提供的蓝牙接口进行相关设置。 首先,我们需要调用`wx.getBluetoothAdapterState`方法来获取蓝牙适配器的状态。通过判断蓝牙适配器状态中的`available`字段来确定当前设备是否支持蓝牙功能。如果支持蓝牙功能,则可以继续进行下一步设置。 接下来,我们需要使用`wx.openBluetoothAdapter`方法来打开蓝牙适配器。在蓝牙适配器打开后,我们可以调用`wx.startBluetoothDevicesDiscovery`方法来开始搜索附近的蓝牙设备。 搜索到蓝牙设备后,可以调用`wx.getBluetoothDevices`方法来获取搜索到的设备列表。可以通过遍历设备列表来找到需要连接的蓝牙设备。找到目标设备后,可以使用`wx.createBLEConnection`方法来与设备建立蓝牙连接。 连接成功后,我们可以使用`wx.getBLEDeviceServices`方法来获取设备的服务列表。通过遍历服务列表,找到需要使用的服务,然后使用`wx.getBLEDeviceCharacteristics`方法获取服务中的特征值列表。 接下来,我们可以调用`wx.writeBLECharacteristicValue`方法来向特征值写入数据。这样可以实现蓝牙设备发送打印指令。 最后,当不再需要与蓝牙设备通信时,可以调用`wx.closeBLEConnection`方法来断开蓝牙连接。同时,为了节约设备电量,也可以调用`wx.stopBluetoothDevicesDiscovery`方法停止蓝牙设备的搜索。 以上就是在UIapp微信小程序中设置蓝牙批量打印的步骤。实现这些功能可以通过使用微信小程序蓝牙接口,并通过正确的参数和方法调用来完成。 ### 回答3: uiapp微信小程序蓝牙批量打印设置是指在使用uiapp微信小程序时,通过蓝牙连接多个打印设备,实现批量打印的设置操作。 首先,在uiapp微信小程序中,我们需要打开蓝牙设备的权限,并搜索附近的可连接打印设备。在搜索到设备后,可以选择其中一个设备进行连接。 连接成功后,可以进行打印设置的操作。首先,可以选择要打印的文件或内容,可以是文本、图片等。然后,可以设置打印的方式,比如单面打印还是双面打印、横向打印还是纵向打印等。还可以设置打印的质量,比如打印的分辨率、图像的色彩等。 除了基本的打印设置,还可以进行高级设置。比如可以设置打印的页码范围,只打印指定的页码或者打印全部页。还可以设置打印份数,指定需要打印的份数。还可以设置打印的排版方式,比如页面的边距、页眉页脚等。 在设置完成后,可以点击打印按钮,开始批量打印。此时,uiapp微信小程序会将要打印内容发送给已连接的蓝牙设备,并开始打印操作。可以对打印过程进行监控,等待打印完成。打印完成后,可以查看打印结果,并根据需要选择是否继续打印其他内容或关闭连接。 总之,uiapp微信小程序蓝牙批量打印设置包括打开蓝牙权限、搜索设备、连接设备、选择打印内容、设置打印方式和质量、高级设置、打印操作监控等步骤。通过这些设置,用户可以方便地在uiapp微信小程序实现蓝牙批量打印

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值