日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
你不知道的前端藍牙應(yīng)用實踐-心率帶

本文為來自 字節(jié)教育-成人與創(chuàng)新前端團隊 成員的文章,已授權(quán) ELab 發(fā)布。

徐聞網(wǎng)站制作公司哪家好,找成都創(chuàng)新互聯(lián)!從網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、成都響應(yīng)式網(wǎng)站建設(shè)公司等網(wǎng)站項目制作,到程序開發(fā),運營維護。成都創(chuàng)新互聯(lián)于2013年開始到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗和運維經(jīng)驗,來保證我們的工作的順利進行。專注于網(wǎng)站建設(shè)就選成都創(chuàng)新互聯(lián)。

一、背景

最近開啟了減肥計劃,購入了一條心率帶,期望在使用劃船機過程中監(jiān)測心率情況。購入后的情況如下:

心率帶不直接顯示數(shù)值,需要連接APP或相關(guān)設(shè)備使用。

官方APP僅實時顯示心率數(shù)據(jù),無法生成心率統(tǒng)計圖表。

通過咕咚APP連接心率帶,開啟運動后可以監(jiān)測心率變化,但劃船機不在支持的運動范圍內(nèi)。

自己簡單實現(xiàn)了一個劃船機節(jié)拍器的小程序。

于是萌生了在自己的節(jié)拍器小程序內(nèi)監(jiān)聽心率數(shù)據(jù)的想法,即Taro小程序中的藍牙應(yīng)用實踐。

二、簡單了解藍牙

對于概念類的知識筆者畢竟不是專業(yè)的,感興趣的同學可以通過百科、搜索引擎等渠道進行了解。這里僅簡單介紹接下來會運用到的一些知識。

中心設(shè)備/外圍設(shè)備

客戶端(中心設(shè)備):在本次實踐中為筆者的手機。

服務(wù)端(外圍設(shè)備):在本次實踐中為心率帶、耳機等設(shè)備。

BLE(Bluetooth Low Energy)

藍牙低能耗技術(shù),實現(xiàn)設(shè)備間的連接與通信。顧名思義,能耗與成本都更低,與之相對應(yīng)的則稱為經(jīng)典藍牙?;诠P者的開發(fā)目的,本文簡單了解設(shè)備連接前(GAP)和連接后(GATT)所涉及的兩個協(xié)議。

(了解更多:藍牙低能耗——百度百科[1]、一文讀懂藍牙技術(shù)從 1.0 到 5.0 的前世今生[2])

GAP(Generic Access Profile)

主要用來控制設(shè)備連接和廣播。通常是由外圍設(shè)備主動、間隔性地廣播設(shè)備信息,等待中心設(shè)備發(fā)現(xiàn)并建立連接。需要注意的是,這種連接方式是獨占的,在建立連接后,外圍設(shè)備將停止廣播。

另一方面,還存在僅向外廣播而不建立連接的iBeacon設(shè)備。

GATT(Generic Attribute Profile)

定義了兩個設(shè)備間的數(shù)據(jù)傳輸方式。GATT中有兩個關(guān)鍵概念:service(服務(wù))與characteristic(特征)。

Service就是一個獨立的邏輯項,它包含一個或多個Characteristic。

Characteristic是GATT中最小的邏輯數(shù)據(jù)單元,其屬性包含properties,標識該特性是否能夠被read、write、notify、indicate。notify與indicate的區(qū)別在于,indicate需要有回復才能發(fā)送下一個數(shù)據(jù)包。

每個服務(wù)和特性都具有唯一的UUID標識,其中部分是由Bluetooth SIG官方定義的, Assigned Numbers | Bluetooth? Technology Website[3],如設(shè)備名、心率數(shù)據(jù)等常用屬性都是官方定義來統(tǒng)一規(guī)范。此外UUID也可以由硬件工程師來自定義實現(xiàn)。

(了解更多:BLE相關(guān)協(xié)議(GAP&GATT)[4])

三、API簡介

Taro中的藍牙API

Taro.openBluetoothAdapter(option) | Taro 文檔[5]

初始化藍牙模塊

Taro.openBluetoothAdapter({
success: function (res) {
console.log("藍牙環(huán)境已啟動:", res);
setInitStatus(true);
},
fail: function (err) {
if (err.errMsg.includes("fail already opened")) {
console.log("藍牙環(huán)境原先已啟動:", err);
setInitStatus(true);
} else {
console.log("藍牙環(huán)境啟動失敗:", err);
setInitStatus(false);
}
},
});

Taro.getBluetoothDevices(option) | Taro 文檔[6]

獲取在藍牙模塊生效期間所有已發(fā)現(xiàn)的藍牙設(shè)備。包括已經(jīng)和本機處于連接狀態(tài)的設(shè)備。

discoverInterval = setInterval(() => {
Taro.getBluetoothDevices({
success: async function (res) {
const canConnectDevices = res.devices.filter(
(item) =>
// 信號強度大于-80
item.RSSI > -80 &&
// 含有設(shè)備名
!["未知設(shè)備", "MBeacon"].includes(item.name)
);
console.log("獲取藍牙設(shè)備列表成功:", canConnectDevices);

setDeviceList(() => canConnectDevices);
},
});
}, 2000);

也可以使用 Taro.onBluetoothDeviceFound(callback) | Taro 文檔[7]來發(fā)現(xiàn)設(shè)備。

Taro.createBLEConnection(option) | Taro 文檔[8]

連接低功耗藍牙設(shè)備。

若小程序在之前已有搜索過某個藍牙設(shè)備,并成功建立連接,可直接傳入之前搜索獲取的 deviceId 直接嘗試連接該設(shè)備,無需進行搜索操作。

Taro.createBLEConnection({
deviceId,
success: function (res) {
console.log("設(shè)備連接成功", res);
setConnectDeviceId(deviceId);

Taro.onBLEConnectionStateChange(function (res) {
// 該方法回調(diào)中可以用于處理連接意外斷開等異常情況
console.log(
`設(shè)備 ${res.deviceId}連接狀態(tài)發(fā)生變化: ${res.connected}`
);
if (!res.connected) {
setConnectDeviceId("");
}
});
},
});

Taro.getBLEDeviceServices(option) | Taro 文檔[9]

獲取藍牙設(shè)備所有服務(wù)(service)。

Taro.getBLEDeviceServices({
// 這里的 deviceId 需要已經(jīng)通過 createBLEConnection 與對應(yīng)設(shè)備建立鏈接
deviceId,
success: function (res) {
console.log('device services:', res.services)
}
})

Taro.getBLEDeviceCharacteristics(option) | Taro 文檔[10]

獲取藍牙設(shè)備某個服務(wù)中所有特征值(characteristic)。

Taro.getBLEDeviceCharacteristics({
// 這里的 deviceId 需要已經(jīng)通過 createBLEConnection 與對應(yīng)設(shè)備建立鏈接
deviceId,
// 這里的 serviceId 需要在 getBLEDeviceServices 接口中獲取
serviceId,
success: function (res) {
console.log('device getBLEDeviceCharacteristics:', res.characteristics)
}
})

Taro.readBLECharacteristicValue(option) | Taro 文檔[11]

讀取低功耗藍牙設(shè)備的特征值的二進制數(shù)據(jù)值。注意:必須設(shè)備的特征值支持 read 才可以成功調(diào)用。

接口讀取到的信息需要在onBLECharacteristicValueChange 方法注冊的回調(diào)中獲取。

Taro.notifyBLECharacteristicValueChange(option) | Taro 文檔[12]

啟用低功耗藍牙設(shè)備特征值變化時的 notify 功能,訂閱特征值。注意:必須設(shè)備的特征值支持 notify 或者 indicate 才可以成功調(diào)用。

另外,必須先啟用 notifyBLECharacteristicValueChange 才能監(jiān)聽到設(shè)備 characteristicValueChange 事件

Taro.onBLECharacteristicValueChange(callback) | Taro 文檔[13]

監(jiān)聽低功耗藍牙設(shè)備的特征值變化事件。必須先啟用 notifyBLECharacteristicValueChange 接口才能接收到設(shè)備推送的 notification。

WEB藍牙API

此處貼一些資料,感興趣可自行閱讀

Web Bluetooth API - Web APIs | MDN[14]

通過 JavaScript 與藍牙設(shè)備通信[15]

四、設(shè)備名稱(Device Name)詳解

首先getBLEDeviceServices獲取到服務(wù)列表:

查詢資料

可知0x1800是我們需要的服務(wù)。getBLEDeviceCharacteristics獲取其特征列表:

查詢資料

可知0x2A00是我們需要的特征。此時可以看到read屬性為true,我們通過onBLECharacteristicValueChange和readBLECharacteristicValue讀一下數(shù)據(jù)看看。

Taro.onBLECharacteristicValueChange(function (characteristic) {
const buffer = characteristic.value
const unit8Array = new Uint8Array(buffer);
console.log("unit8Array: ", unit8Array);

// 轉(zhuǎn)字符串
const encodedString = String.fromCodePoint.apply(null, unit8Array);
console.log('設(shè)備名:', encodedString)
});

Taro.readBLECharacteristicValue({
deviceId,
serviceId: DeviceNameService,
characteristicId: DeviceNameCharacteristics,
});

得到輸出,某米耳機:

大家應(yīng)該已經(jīng)發(fā)現(xiàn),給到的特征值其實是ArrayBuffer格式。

(了解更多:談?wù)凧S二進制:File、Blob、FileReader、ArrayBuffer、Base64 - 掘金[16])

此時需要我們將其轉(zhuǎn)化為字符串。除了上面的方法外,還可以先轉(zhuǎn)16進制,再轉(zhuǎn)字符串:

// 轉(zhuǎn)16進制
const hexString = Array.prototype.map
.call(unit8Array, function (bit) {
return ("00" + bit.toString(16)).slice(-2);
})
.join("");
console.log("hexString: ", hexString);

// 16進制轉(zhuǎn)字符串
const hex2String = (hexString:string) => {
if (hexString.length % 2) return "";
var tmp = "";
for (let i = 0; i < hexString.length; i += 2) {
tmp += "%" + hexString.charAt(i) + hexString.charAt(i + 1);
}
return decodeURI(tmp);
}

五、心率測量(Heart Rate Measurement)詳解

同樣,首先我們拿到了所需的服務(wù)和特征如下。

export const HEART_RATE_SERVICE_UUID =
"0000180D-0000-1000-8000-00805F9B34FB";
export const HEART_RATE_CHARACTERISTIC_UUID =
"00002A37-0000-1000-8000-00805F9B34FB";

在設(shè)備連接后,通過onBLECharacteristicValueChange和notifyBLECharacteristicValueChange訂閱特征值變化。

export const blueToothGetHeartRate = (
deviceId: string,
onHeartRateChange: (newHeartRate: number) => void
) => {
Taro.onBLECharacteristicValueChange(function (characteristic) {
const heartRateValue = getHeartRateValue(characteristic.value);
onHeartRateChange(heartRateValue);
});
Taro.notifyBLECharacteristicValueChange({
state: true, // 啟用 notify 功能
deviceId,
serviceId: HEART_RATE_SERVICE_UUID,
characteristicId: HEART_RATE_CHARACTERISTIC_UUID,
});
};

此時我們已經(jīng)能夠獲取到心率帶發(fā)送的心率數(shù)據(jù)如下。

但是此時如果按照上文解析設(shè)備名稱的方式,將其轉(zhuǎn)化為字符串,將得到一串亂碼。

所以需要根據(jù)協(xié)議文檔(https://www.bluetooth.com/specifications/specs/heart-rate-service-1-0/)來解讀這幾個數(shù)據(jù)。

標志字段:

  • 二進制:10110、十進制:22、十六進制:16
  • 其中位0為心率格式位,決定心率數(shù)據(jù)是uint8(位0 === 0)還是unit16(位0 === 1)

  • 位1、位2為傳感器接觸狀態(tài)位。11表示支持皮膚接觸檢測且接觸正常。
  • 位3為能量消耗狀態(tài)位,0表示能量消耗字段不存在.
  • 位4為RR-Interval狀態(tài)位,1表示存在一個或多個 RR-Interval 值。

心率數(shù)值:

  • 二進制:1100101、十進制:101、十六進制:65
  • 當心率小于255時,unit8足以。但如果需要支持更高的心率值(某些動物),則需要為unit16

  • 此時我們根據(jù)標志字段0,已經(jīng)能夠獲取到需要的心率值:101。那么還剩下兩個字段代表什么意思呢?

RR-intreval 心率間隔:

  • 從前面的標志字段分析中,我們發(fā)現(xiàn)該設(shè)備不支持能量消耗狀態(tài)但支持RR-interval。且RR-interval可能是一位也可能是多位。那么我們該怎么讀取這個數(shù)字呢?
  • 首先我們顧名思義,心率間隔就是兩次心跳間的間隔時長,從上面的心率值推算:
  • 60*1000/101 ≈594ms
  • 接下來看這兩個數(shù)字。
  • 二進制:1010010、十進制:82、十六進制:52
  • 二進制:10、十進制:2、十六進制:02
  • 嘗試2*256+82 = 594,謎團解開了~

六、總結(jié)與疑惑

至此整個藍牙心率設(shè)備數(shù)據(jù)獲取的實現(xiàn)就完成了,可以在使用節(jié)拍器的同時監(jiān)控自身的心率數(shù)據(jù)了。

整體來說整個開發(fā)過程還是比較簡單的,畢竟API文檔描述的非常清晰,主要時間耗費在解讀心率數(shù)據(jù)這個過程,后來知道應(yīng)該從協(xié)議文檔出發(fā)解讀就好說了。

由于是在業(yè)余時間實現(xiàn)的上述能力,開發(fā)過程中存在不少疑惑沒來得及研究。這里先拋兩個問題出來,希望了解相關(guān)知識的同學能夠不吝賜教。

  • 在arraybuffer轉(zhuǎn)16進制過程中("00" + bit.toString(16)).slice(-2);?,為什么要先"00" +?,然后再.slice(-2)??直接bit.toString(16)是否可行?
  • 針對某米耳機,筆者暫時沒有在服務(wù)和特征中找到電量信息相關(guān)的數(shù)據(jù),那么手機設(shè)備又是如何獲取到耳機電量的呢?

猜測電池服務(wù)和特性分別是0x180F Battery service 和 0x2A19 Battery Level ,但上圖耳機返回的service列表中沒找到該服務(wù)。

本文作者正在等待你的幫助。

參考資料

[1]藍牙低能耗——百度百科: https://baike.baidu.com/item/%E8%93%9D%E7%89%99%E4%BD%8E%E8%83%BD%E8%80%97

[2]一文讀懂藍牙技術(shù)從 1.0 到 5.0 的前世今生: https://zhuanlan.zhihu.com/p/37717509

[3]Assigned Numbers | Bluetooth? Technology Website: https://www.bluetooth.com/specifications/assigned-numbers/

[4]BLE相關(guān)協(xié)議(GAP&GATT): https://www.jianshu.com/p/62eb2f5407c9

[5]Taro.openBluetoothAdapter(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth/openBluetoothAdapter

[6]Taro.getBluetoothDevices(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth/getBluetoothDevices

[7]Taro.onBluetoothDeviceFound(callback) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth/onBluetoothDeviceFound

[8]Taro.createBLEConnection(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/createBLEConnection

[9]Taro.getBLEDeviceServices(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/getBLEDeviceServices

[10]Taro.getBLEDeviceCharacteristics(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/getBLEDeviceCharacteristics

[11]Taro.readBLECharacteristicValue(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/readBLECharacteristicValue

[12]Taro.notifyBLECharacteristicValueChange(option) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/notifyBLECharacteristicValueChange

[13]Taro.onBLECharacteristicValueChange(callback) | Taro 文檔: https://docs.taro.zone/docs/apis/device/bluetooth-ble/onBLECharacteristicValueChange

[14]Web Bluetooth API - Web APIs | MDN: https://developer.mozilla.org/en-US/docs/Web/API/Web_Bluetooth_API

[15]通過 JavaScript 與藍牙設(shè)備通信: https://web.dev/i18n/zh/bluetooth/

[16]談?wù)凧S二進制:File、Blob、FileReader、ArrayBuffer、Base64 - 掘金: https://juejin.cn/post/7148254347401363463#heading-9


網(wǎng)頁標題:你不知道的前端藍牙應(yīng)用實踐-心率帶
網(wǎng)站路徑:http://www.5511xx.com/article/ccossss.html