uni-app 安卓Native.js蓝牙连接票据打印机完整代码已测试修改

发布于 1周前 作者 vueper 来自 Uni-App

uni-app 安卓Native.js蓝牙连接票据打印机完整代码已测试修改

测试机:佳博PT-280便携打印机
手机:华为低端
功能:扫描周围蓝牙设备加入列表,点击未配对设备,自动配对设备,点击已配对设备,进行打印测试

HTML代码

<!DOCTYPE html>  
<html>  

    <head>  
        <meta charset="UTF-8">  
        <title></title>  
        <script src="js/pr.js"></script>  
    </head>  

    <body>  
        <p><input id="bt1" type="button" value="搜索设备" onclick="searchDevices('a')"></p>  
        <div>  
            未配对蓝牙设备  
            <ul id="list1"></ul>  
        </div>  
        <div>  
            已配对蓝牙设备  
            <ul id="list2"></ul>  
        </div>  
    </body>  
</html>

JS代码

//address=""搜索蓝牙//address=设备mac地址,自动配对给出mac地址的设备  
function searchDevices(address) {  
    //注册类  
    var main = plus.android.runtimeMainActivity();  
    var IntentFilter = plus.android.importClass('android.content.IntentFilter');  
    var BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");  
    var BluetoothDevice = plus.android.importClass("android.bluetooth.BluetoothDevice");  
    var BAdapter = BluetoothAdapter.getDefaultAdapter();  
    console.log("开始搜索设备");  
    var filter = new IntentFilter();  
    var bdevice = new BluetoothDevice();  
    var on = null;  
    var un = null;  
    var vlist1 = document.getElementById('list1'); //注册容器用来显示未配对设备  
    vlist1.innerHTML = ''; //清空容器  
    var vlist2 = document.getElementById('list2'); //注册容器用来显示未配对设备  
    vlist2.innerHTML = ''; //清空容器  
    var button1 = document.getElementById('bt1');  
    button1.disabled=true;  
    button1.value='正在搜索请稍候';  
    BAdapter.startDiscovery(); //开启搜索  
    var receiver;  
    receiver = plus.android.implements('io.dcloud.android.content.BroadcastReceiver', {  
        onReceive: function(context, intent) { //实现onReceiver回调函数  
            plus.android.importClass(intent); //通过intent实例引入intent类,方便以后的‘.’操作  
            console.log(intent.getAction()); //获取action  
            if(intent.getAction() == "android.bluetooth.adapter.action.DISCOVERY_FINISHED"){  
                main.unregisterReceiver(receiver);//取消监听  
                button1.disabled=false;  
                button1.value='搜索设备';  
                console.log("搜索结束")  
            }else{  
            BleDevice = intent.getParcelableExtra(BluetoothDevice.EXTRA_DEVICE);  
            //判断是否配对  
            if (BleDevice.getBondState() == bdevice.BOND_NONE) {  
                console.log("未配对蓝牙设备:" + BleDevice.getName() + '    ' + BleDevice.getAddress());  
                //参数如果跟取得的mac地址一样就配对  
                if (address == BleDevice.getAddress()) {  
                    if (BleDevice.createBond()) { //配对命令.createBond()  
                        console.log("配对成功");  
                        var li2 = document.createElement('li'); //注册  
                        li2.setAttribute('id', BleDevice.getAddress()); //打印机mac地址  
                        li2.setAttribute('onclick', 'print(id)'); //注册click点击列表进行打印  
                        li2.innerText = BleDevice.getName();  
                        vlist2.appendChild(li2);  
                    }  

                } else {  
                    if(BleDevice.getName() != on ){ //判断防止重复添加  
                    var li1 = document.createElement('li'); //注册  
                    li1.setAttribute('id', BleDevice.getAddress()); //打印机mac地址  
                    li1.setAttribute('onclick', 'searchDevices(id)'); //注册click点击列表进行配对  
                    on = BleDevice.getName();  
                    li1.innerText = on;  
                    vlist1.appendChild(li1);  

                    }  

                }  
            } else {  
                if(BleDevice.getName() != un ){ //判断防止重复添加  
                console.log("已配对蓝牙设备:" + BleDevice.getName() + '    ' + BleDevice.getAddress());  
                var li2 = document.createElement('li'); //注册  
                li2.setAttribute('id', BleDevice.getAddress()); //打印机mac地址  
                li2.setAttribute('onclick', 'print(id)'); //注册click点击列表进行打印  
                un = BleDevice.getName();                 
                li2.innerText = un;  
                vlist2.appendChild(li2);}  
            }}  

        }  
    });  

    filter.addAction(bdevice.ACTION_FOUND);  
    filter.addAction(BAdapter.ACTION_DISCOVERY_STARTED);  
    filter.addAction(BAdapter.ACTION_DISCOVERY_FINISHED);  
    filter.addAction(BAdapter.ACTION_STATE_CHANGED);  

    main.registerReceiver(receiver, filter); //注册监听  
}  

var device = null,  
    BAdapter = null,  
    BluetoothAdapter = null,  
    uuid = null,  
    main = null,  
    bluetoothSocket = null;  

function print(mac_address) {  
    if (!mac_address) {  
        mui.toast('请选择蓝牙打印机');  
        return;  
    }  

    main = plus.android.runtimeMainActivity();  
    BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");  
    UUID = plus.android.importClass("java.util.UUID");  
    uuid = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");  
    BAdapter = BluetoothAdapter.getDefaultAdapter();  
    device = BAdapter.getRemoteDevice(mac_address);  
    plus.android.importClass(device);  
    bluetoothSocket = device.createInsecureRfcommSocketToServiceRecord(uuid);  
    plus.android.importClass(bluetoothSocket);  

    if (!bluetoothSocket.isConnected()) {  
        console.log('检测到设备未连接,尝试连接....');  
        bluetoothSocket.connect();  
    }  

    console.log('设备已连接');  

    if (bluetoothSocket.isConnected()) {  
        var outputStream = bluetoothSocket.getOutputStream();  
        plus.android.importClass(outputStream);  
        var string = "打印测试\r\n";  
        var bytes = plus.android.invoke(string, 'getBytes', 'gbk');  
        outputStream.write(bytes);  
        outputStream.flush();  
        device = null //这里关键  
        bluetoothSocket.close(); //必须关闭蓝牙连接否则意外断开的话打印错误  

    }  
}

1 回复

在uni-app中使用Native.js进行蓝牙连接并控制票据打印机,可以通过调用安卓原生API来实现。以下是一个完整的代码示例,展示了如何通过Native.js在uni-app中连接蓝牙票据打印机并进行打印操作。请注意,这段代码假设你已经熟悉uni-app和Native.js的基本用法,并且已经在manifest.json中配置了Native.js的相关权限。

首先,确保在manifest.json中添加了必要的权限:

"android": {
    "permissions": [
        "<uses-permission android:name=\"android.permission.BLUETOOTH\"/>",
        "<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\"/>",
        "<uses-permission android:name=\"android.permission.BLUETOOTH_SCAN\"/>",
        "<uses-permission android:name=\"android.permission.BLUETOOTH_CONNECT\"/>",
        "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>"
    ]
}

然后,在你的uni-app项目中,创建一个新的页面或在现有页面中添加以下代码:

// pages/bluetooth/bluetooth.vue
<template>
  <view>
    <button @click="initBluetooth">初始化蓝牙</button>
    <button @click="scanDevices">扫描设备</button>
    <button @click="connectDevice">连接设备</button>
    <button @click="sendData">发送数据</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      bluetoothAdapter: null,
      device: null,
      bluetoothSocket: null,
    };
  },
  methods: {
    initBluetooth() {
      plus.android.importClass('android.bluetooth.BluetoothAdapter');
      this.bluetoothAdapter = plus.android.invoke(plus.android.getRuntimeMainActivity(), 'getSystemService', 'bluetooth');
    },
    scanDevices() {
      // 扫描蓝牙设备逻辑
      // ...
    },
    connectDevice() {
      // 连接蓝牙设备逻辑
      // 使用this.bluetoothAdapter.getRemoteDevice(address)获取设备对象
      // this.bluetoothAdapter.getProfileProxy(..., BluetoothProfile.Device.class, callback)
      // ...
    },
    sendData() {
      // 发送数据到蓝牙设备逻辑
      // this.bluetoothSocket.getOutputStream().write(data);
      // ...
    }
  }
};
</script>

注意:由于篇幅限制,scanDevicesconnectDevicesendData方法中的具体实现细节被省略了。在实际应用中,你需要使用BluetoothAdapterstartDiscovery方法来扫描设备,使用BluetoothDevicecreateRfcommSocketToServiceRecord方法来创建socket连接,并通过socket的输入输出流来发送和接收数据。

此外,由于蓝牙操作是异步的,你可能需要使用回调函数或Promise来处理这些异步操作。同时,记得在不需要时关闭蓝牙适配器和socket连接,以释放资源。

这个示例提供了一个基本的框架,你可以根据具体的打印机指令集和需求来完善代码。

回到顶部