ブラウザからのBLE接続方法
2022/05/12
ブラウザにはBluetooth接続用のAPIが用意されています。 これを利用することでサイトからBLE接続をしてbluetooth機器と連携することが可能になります。
今回はこの接続方法を紹介します。
BLE接続コード例
先に接続のコード一例を載せておきます。
const connectDevice = async (serviceUUID: string) => {
const options: RequestDeviceOptions = {
acceptAllDevices: true,
optionalServices: [serviceUUID]
}
const device = await navigator.bluetooth.requestDevice(options);
console.log(device.name);
const server = await device.gatt.connect();
console.log('SERVER', server);
const service = await server.getPrimaryService(serviceUUID);
console.log('SERVICE', service);
const characteristics = await service.getCharacteristics();
console.log('CHARACTERISTICS', characteristics);
return characteristics
}
async function main() {
const characteristics = await connectDevice('00000000-0000-1000-8000-00805f9b34fb');
// 取得できたcharacteristicsから以下のようにBLE通信が可能
// ex.)
// characteristics[0].writeValue(new Uint8Array([0x01]))
// characteristics[1].addEventListener('characteristicvaluechanged', onUpdateValue)
}
main();コードはplaygroundから実行可能です。
実行するとブラウザからペア設定を要求されます。 ※ 上記のコードは接続要求をするだけなので、ペア設定しても特に何も起こりません。
コードを詳細に見ると、BLEを接続して使用するまでに何段階かブラウザのAPIを叩いているのが確認できると思います。 以下それぞれの処理が何をしているのか簡単に説明していきます。
接続に使用しているweb bluetooth API
navigator.bluetooth.requestDevice
navigator.bluetooth.requestDeviceを実行するとブラウザを介してBLEスキャンを行います。
要求がacceptされるとdeviceオブジェクトを取得できます（この時点ではdeviceの情報を取得しているだけなので、接続はできていません）。
const options: RequestDeviceOptions = {
acceptAllDevices: true,
optionalServices: [serviceUUID]
}
const device = await navigator.bluetooth.requestDevice(options);
console.log(device.name);device.gatt.connect
取得したdeviceオブジェクトからdevice.gatt.connectでgatt通信による接続要求を行います。
const server = await device.gatt.connect();
console.log('SERVER', server);service、characteristicsの定義を保持しているBLE内gattサーバーとの接続が成功すると、gattサーバーオブジェクトを取得できます。
server.getPrimaryService
serverオブジェクトのgetPrimaryServicemethodでgattサーバーに存在するserviceを取得できます。
const service = await server.getPrimaryService(serviceUUID);
console.log('SERVICE', service);service.getCharacteristics
serviceオブジェクトのgetCharacteristicsmethodでserviceに登録されているcharacteristicsを取得できます。
const characteristics = await service.getCharacteristics();
console.log('CHARACTERISTICS', characteristics);取得できたcharacteristicsを介してBLEの各機能へのアクセスが可能になります。
// 取得できたcharacteristicsから以下のようにBLE通信が可能
// ex.)
// characteristics[0].writeValue(new Uint8Array([0x01]))
// characteristics[1].addEventListener('characteristicvaluechanged', onUpdateValue)接続解除はdevice.gatt.disconnectで可能です。
