Web Bluetooth APIがmicro:bitを面白くする。
よっ、Web Bluetooth API！
前回は、JavaScriptブロックエディタのような、チョッパヤプログラミングでも、Bluetoothがいろいろ使えそうであるということがわかりました。
となれば、実際にBluetoothで通信してみようと思います。今回はブラウザ上でWeb Bluetooth APIを動かして、micro:bitにアクセスして、加速度センサーの値を監視してみようと思います。
まずはmicro:bit側のプログラミング
とはいえ、プログラミングというレベルではないですが・・・。
こんな感じで、ありとあらゆるサービスをmicro:bit起動時にスタートするだけ。今回は加速度センサーしか使わないので、それだけでもいいかもしれません。
bluetooth.startAccelerometerService() bluetooth.startButtonService() bluetooth.startIOPinService() bluetooth.startLEDService() bluetooth.startTemperatureService() bluetooth.startMagnetometerService()
30秒くらいでコーディングが終了します。
HTML側のプログラミング
まず、事前情報として、以下のサイトを参考にしました。
Bluetooth Developer Studio - Profile Report
Web Bluetooth APIの仕様書と、micro:bitのBLE関係の資料です。前者はW3Cの公式っぽいんですが、後者は非公式情報っぽいのでお気をつけて。公式のBLEの仕様書って何処かにあるんですかね・・・。
HTML側のコードはちょっと長いので、githubにアップしておきました。そして、毎度毎度のことですが、HTMLコーディング能力が低すぎるので、あまり参考にならないかもしれません…。
簡単にサマると、こんなことをしています。
- 近くにあるBluetoothデバイスを表示させて、micro:bitを選ばせる
- 接続して、加速度データの通知間隔を設定する
- 加速度データの通知設定をする
- 加速度データを受信したら、そのデータを表示する
- 加速度データに応じて、ページの背景色を変える
さっそく動かしてみます。
こんな感じです。micro:bitを動かすと、Webページの背景色が変わっていることがわかると思います。
ちなみに、githubのgithub pages機能により、みなさんも以下のページにアクセスすることで、micro:bitの加速度センサーの値を読み取ることができます。もしよかったら、遊んでみてください。(Web Bluetooth API対応のOS・ブラウザに限り動作しますが、たまに動かないこともあるのでご了承ください…)
いやぁ、micro:bitって本当にいいもんですねー。
