# ゼミ課題１ はじめにマイコンの設定から始める。 プログラムを作成するために[https://makecode.microbit.org/#](https://makecode.microbit.org/#)を開き新しいプロジェクトを作成をクリック<br> ![](https://i.imgur.com/aYdnhgu.png) <br> プロジェクト名を決めて作成 <br> Bluetoothを使うために①「高度なブロック」を選択し②「拡張機能」を選択<br> ![](https://i.imgur.com/cYvQ9aq.png)<br><br> 拡張機能からブルートゥースを選択しブルートゥースをダウンロードする<br> ![](https://i.imgur.com/ItEN9U0.jpg)<br><br> 接続しているか確認できるようにBluetoothブロックから「Bluetoothが接続された時」、「Bluetooth接続が切断された時」、基本ブロックから「アイコンの表示」を選択し以下の図のように並べる。 ![](https://i.imgur.com/75gIErj.png) ２週目 実機がきちんと動くかの確認のため以下の図のプログラムを作りダウンロードする。（このプログラムは最初ハートが表示されAボタンを押すと怒った顔、揺らすとUFOが出るように作ってある） ![](https://i.imgur.com/KI4yycz.jpg) microbit側を以下のプログラムにする ![](https://i.imgur.com/s85aYjw.jpg) Web Bluetooth APIを使用するための設定をchormに設定するために[chrome://flags/#enable-experimental-web-platform-features ](chrome://flags/#enable-experimental-web-platform-features )にとんでExperimental Web Platform featuresをDisabledからEnabledにする。 ![](https://i.imgur.com/mqv2z24.png) 設定したらRELAUNCHボタンを押すかchromを再起動する。 同じ階層にhtml,jsを作る(今回はファイル名はmain.html,main.jsとする) [http://jquery.com/download/](http://jquery.com/download/) よりjQuery3.5.1を保存し名前をjQuery3.5.1.jsにしmain.htmlと同じ階層に置く これを試してみた結果ペアリングがうまくできず書いてある記事の通りに動かなかった ![](https://i.imgur.com/TQki6oI.png) 機器が悪いのかを確認するためアプリでの接続を試みて結果動いたため機器の問題ではないことがわかった。 参考にしたサイト[https://www.pc-koubou.jp/magazine/12416](https://www.pc-koubou.jp/magazine/12416) ３周目 コンソールログを確認してみたがエラーもwarningも出ていないことが判明。 ![](https://i.imgur.com/vP4Ije9.png) 他のサイトで試してみようと思い次のサイトに移動しました [https://qiita.com/yokmama/items/5522fabfb5b9623278e2](https://qiita.com/yokmama/items/5522fabfb5b9623278e2) どんなプログラムか最後まで読んでみたところ追記に接続する時microbit川での操作が必要なことに判明 ![](https://i.imgur.com/DGdxtZn.jpg) 実際にこの通りに操作してみた結果microbitのBluetooth接続が確認できゲームもきちんと動きました。 ![](https://i.imgur.com/qkCxJQh.jpg) 4週目 温度センサーを使い36度以上なら画面を赤くし36度以下なら画面を青くするプログラムを作ろうと思い温度センサーを使ったサイトをコピーしました。 microbitを以下のようにする ![](https://i.imgur.com/Ie4nyKU.png) jsのプログラムを以下に示す。 ``` <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Web Bluetooth機能で温度を取得するサンプル</title> <script> var targetDevice; ////////////////////////////////////////////////// /// 接続 ////////////////////////////////////////////////// function getTemperature() { ////////////////////////////////////////////////// /// 定数の定義 ////////////////////////////////////////////////// /// UUID const UUID_TEMPERATURE_SERVICE = 'e95d6100-251d-470a-a062-fa1922dfa9a8' const UUID_TEMPERATURE_SERVICE_CHARACTERISTIC_DATA = 'e95d9250-251d-470a-a062-fa1922dfa9a8' const UUID_TEMPERATURE_SERVICE_CHARACTERISTIC_PERIOD = 'e95d1b25-251d-470a-a062-fa1922dfa9a8' /// 取得間隔(ミリ秒) const INTERVAL = 1000 ////////////////////////////////////////////////// /// デバイスのスキャン ////////////////////////////////////////////////// navigator.bluetooth.requestDevice({ filters: [ { namePrefix: "BBC micro:bit" } ], optionalServices: [UUID_TEMPERATURE_SERVICE] }) ////////////////////////////////////////////////// /// GATT接続 ////////////////////////////////////////////////// .then(device => { targetDevice = device; console.log("device", device); return device.gatt.connect(); }) ////////////////////////////////////////////////// /// プライマリーサービスの取得 ////////////////////////////////////////////////// .then(server => { console.log('server', server); server.getPrimaryService(UUID_TEMPERATURE_SERVICE) ////////////////////////////////////////////////// /// 温度の取得 ////////////////////////////////////////////////// .then(service => { /// 温度の取得間隔の設定 service.getCharacteristic(UUID_TEMPERATURE_SERVICE_CHARACTERISTIC_PERIOD) .then(characteristic => { characteristic.writeValue(new Uint16Array([INTERVAL])); }) .catch(error => { console.log(error); alert('取得間隔の設定に失敗しました。'); }) /// 温度の取得開始 service.getCharacteristic(UUID_TEMPERATURE_SERVICE_CHARACTERISTIC_DATA) .then(characteristic => { characteristic.startNotifications() .then(char => { alert('接続しました。'); characteristic.addEventListener('characteristicvaluechanged',onTemperatureChanged); console.log('Temperature : ', char); }) }) .catch(error => { console.log(error); alert('取得開始に失敗しました。'); }) }) }) .catch(error => { console.log(error); alert('接続に失敗しました。'); }); ////////////////////////////////////////////////// /// 温度の表示 ////////////////////////////////////////////////// function onTemperatureChanged (event) { let temperature = event.target.value.getUint8(0, true); console.log('温度 : ' + temperature); document.getElementById("temperature").innerText = temperature + '℃'; } } ////////////////////////////////////////////////// /// 切断 ////////////////////////////////////////////////// function disconnect() { if (!targetDevice || !targetDevice.gatt.connected){ return; } targetDevice.gatt.disconnect(); alert("切断しました。"); } </script> </head> <body> <div id="BLE_temperature"> <div id="BLE_title"> <h3>Web Bluetooth機能で温度を取得するサンプル</h3> </div> <div id="BLE_button"> <input type="button" value="micro:bitと接続する" onclick="getTemperature();"/> <input type="button" value="切断する" onclick="disconnect();"/> </div> <div id="BLE_display"> <p>温度：<span id="temperature">micro:bitと接続して、温度を取得してください。</span></p> <div> </div> </body> </html> ``` 動かしてみた結果以下のエラーが発生 ![](https://i.imgur.com/pS58qZV.png) UUIDがマッチしないというニュアンスのエラーだったため温度センサーのUUIDを確認してみた結果 ![](https://i.imgur.com/MuL49xD.jpg) IDには違いがないため入力したUUIDが違うかと思われる