-
webBluetooth API的 缺点, 只能固定的几个浏览器使用,其他浏览器打开使用不了这个api,ios也用不了,因为ios的浏览器内核都不属于webBluetooth 的条件
-
因为使用的地方比较多 所以在main.js 进行全部封装
csharp
// 蓝牙服务
Vue.prototype.$bluetooth={
device:null,//设备
server:null,//服务
isItConnect:false,//蓝牙状态判断
connectingInProgress:false,//蓝牙状态判断
doYouWantToRefresh:false,//刷新当前页面
bluetoothInterval:null,//监听
keyRandomCode:''//密钥随机码
}
// 开始监听蓝牙连接状态
Vue.prototype.$startBluetoothMonitoring=function (){
Vue.prototype.$bluetooth.bluetoothInterval = setInterval(Vue.prototype.$checkBluetoothConnection, 5000); // 每5秒检查一次
}
// 停止监听蓝牙连接状态
Vue.prototype.$stopBluetoothMonitoring=function() {
if (Vue.prototype.$bluetooth.bluetoothInterval) {
clearInterval(Vue.prototype.$bluetooth.bluetoothInterval);
Vue.prototype.$bluetooth.bluetoothInterval=null
}
}
// 检查蓝牙连接状态 因为没法监听蓝牙舒服断开得用定时器去不停的写入指令 如果写入失败就是蓝牙断开了
Vue.prototype.$checkBluetoothConnection=function () {
// console.log(Vue.prototype.$bluetooth.device,this)
if (!Vue.prototype.$bluetooth.device) {
console.log('No device connected.');
return;
}
Vue.prototype.$bluetooth.server.getPrimaryServices().then(services=>{
let uuid= services.filter(el=>{return el.uuid.indexOf(
'0000ffc0') != -1})
if(uuid){
Vue.prototype.$bluetooth.server.getPrimaryService(uuid[0].uuid).then(service => {
service.getCharacteristics().then(characteristics=>{
console.log(characteristics,'所有特征')
service.getCharacteristic(characteristics[0].uuid).then(characteristic => {
var hexArray = [0x66, 0xf1, 0x3b, 0x77];
// 创建一个 Uint8Array 实例
const uint8Array = new Uint8Array(hexArray);
// 获取 ArrayBuffer
const arrayBuffer = uint8Array.buffer;
characteristic.writeValue(arrayBuffer).then(() => {
// 写入成功
}).catch(error => {
console.log('Error reading characteristic:', error);
Vue.prototype.$disconnectConnection()
console.log('写入失败')
// 写入特征时出错
});
})
})
})
}
})
}
// 断开蓝牙
Vue.prototype.$disconnectConnection=function (){
Vue.prototype.$bluetooth.device.gatt.disconnect()
}
// 处理设备断开连接的情况
Vue.prototype.$onDisconnected=function (event) {
let device=''
if(event){
device=event.target
}
console.log(device,'设备断开')
Vue.prototype.$bluetooth.isItConnect=false
Vue.prototype.$stopBluetoothMonitoring()
Vue.prototype.$bluetooth.device=null
if(!Vue.prototype.$bluetooth.doYouWantToRefresh){
this.$dialog.alert({
title: window.$i18n.t('提示'),
message: window.$i18n.t('蓝牙已断开请重新连接'),
confirmButtonText:window.$i18n.t('确定'),
confirmButtonColor:'#4800E0'
}).then(() => {
location.reload()
// this.getLanya()
// on close
});
}
console.log('通知用户设备断开连接');
}
//蓝牙搜索并连接
Vue.prototype.$bluetoothConnectivity=function (vmNumber,manufacturerId,source,numIn){
let optionalServices=[]
navigator.bluetooth.requestDevice({
filters: [{
name: vmNumber //蓝牙名称
}],
optionalServices: optionalServices //服务值 小写
}).then(device => {
Vue.prototype.$bluetooth.device=device
Vue.prototype.$bluetooth.connectingInProgress=true
this.$store.dispatch("bluetooth/setIsItConnect",true);
// 设备已被发现
device.gatt.connect().then(server => {
Vue.prototype.$bluetooth.server=server
// 蓝牙监听
device.addEventListener('gattserverdisconnected', Vue.prototype.$onDisconnected);
this.$store.dispatch("bluetooth/setIsItConnect",true);
this.$store.dispatch("bluetooth/setConnectingInProgress",false);
Vue.prototype.$bluetooth.isItConnect=true
Vue.prototype.$bluetooth.connectingInProgress=false
})
.catch(error => {
Vue.prototype.$bluetooth.isItConnect=false
Vue.prototype.$bluetooth.connectingInProgress=false
Vue.prototype.$bluetooth.server=null
Vue.prototype.$bluetooth.device=null
this.$store.dispatch("bluetooth/setIsItConnect",false);
this.$store.dispatch("bluetooth/setConnectingInProgress",false);
this.$dialog.alert({
title: window.$i18n.t('提示'),
message: window.$i18n.t('连接失败请重新连接'),
confirmButtonText:window.$i18n.t('确定'),
confirmButtonColor:'#4800E0'
}).then(() => {
Vue.prototype.$bluetoothConnectivity(localStorage.getItem('vmNumber'),localStorage.getItem('manufacturerId'))
});
console.log('连接蓝牙失败',error)
// 建立连接时出错
});
})
.catch(error => {
if (error.message.includes('Web Bluetooth is not supported on this platform')||error.message.includes('Bluetooth adapter not available')) {
this.$dialog.alert({
title: window.$i18n.t('提示'),
message: window.$i18n.t('该浏览器不支持蓝牙'),
confirmButtonText: window.$i18n.t('去商城首页'),
confirmButtonColor: '#4800E0',
closeOnPopstate: false
}).then(() => {
this.$router.push(
{
path: "/",
query: { storeId: localStorage.getItem("storeID") },
});
});
}
// 发现设备时出错
});
}