SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

DeveloperZine(デベロッパージン)- エンジニアの意思決定を支える技術情報メディア ProductZine

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

IoT Starter Studio

Bluetooth搭載LED照明「PLAYBULB」をWeb Bluetoothを使ってLチカさせてみよう

IoT Starter Studio 第19回

コードを記述

 以下のコードでHTMLとJavaScriptファイルを作成します。

 Web Bluetoothの細かい仕様などは公式ドキュメントを参照して下さい。

index.html
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <button id="pconnect">connect</button>
        <button id="ptoggle">on / off</button>
        <script src="app.js"></script>
    </body>
</html>
app.js
'use strict';

const UUIDS = {
    SERVICE: `heart_rate`, //0x180D
    CHARACTERISTICS: `heart_rate_control_point` //0x2A39
};
const requestOptions = {
    acceptAllDevices: true,
    optionalServices: ['heart_rate']
};

const $pconnect = document.getElementById('pconnect');
const $ptoggle = document.getElementById('ptoggle');
$ptoggle.disabled = true; //非アクティブに

let ctl = {};

/**
 * 接続
 */
const pConnect = async () => {
    const device = await navigator.bluetooth.requestDevice(requestOptions);
    const server = await device.gatt.connect();
    const service = await server.getPrimaryService(UUIDS.SERVICE);
    const characteristic = await service.getCharacteristic(UUIDS.CHARACTERISTICS);
    ctl = characteristic;
    $ptoggle.disabled = false; //アクティブに
    console.log('connected');
}

//照明のオン/オフ
const pToggle = async () => {
    const val = await ctl.readValue();//現状の照明状態を取得
    if(val.getUint8(0) === 0){
        await ctl.writeValue(new Uint8Array([1,14]));
    }else{
        await ctl.writeValue(new Uint8Array([1,0]));
    }
}

$ptoggle.addEventListener('click', pToggle);
$pconnect.addEventListener('click', pConnect);

実行してみる

 Web Bluetoothを利用するためには最新のGoogle Chromeをインストールしておく必要があります。

 上記で作成したファイルをChromeで実行してみましょう。connectボタンを押すと、周辺のBLE機器のリストが表示されます。

 接続が完了するとon/offボタンがアクティブになります。

 実際に押して確認してみましょう。

 Webブラウザから照明のオン/オフが切り替えられましたね!

おわりに

 PLAYBULBをWebBluetoothを利用して、ブラウザからLチカすることができました。他のPLAYBULBシリーズも色々なものがありますが、同じ要領でハックすることが可能だと思われます。

 おうちハックの定番電球といえばHueを思い浮かべる人も多いですが、PLAYBULBシリーズも、今回紹介した内容を応用すれば十分使えると思います。

 応用すれば、家の全ての照明をブラウザから制御したり、指定した時間に照明を付けて起こしてくれるなど、より生活を便利にしてくれる可能性が広がりますね。皆さんもぜひ試してみてください。

購入はこちら

この記事は参考になりましたか?

連載通知を行うには会員登録(無料)が必要です。
既に会員の方はを行ってください。
IoT Starter Studio連載記事一覧

もっと読む

この記事の著者

菅原のびすけ(dotstudio株式会社)(スガワラ ノビスケ)

 日本最大規模のIoTコミュニティ「IoTLT」主催。岩手県立大学大学院ソフトウェア情報学研究科を卒業後、株式会社LIGでWebエンジニアとして入社し、Web開発に携わる。2016年にdotstudio株式会社を立ち上げ、今はIoT領域を中心に活動している。JavaScript RoboticsコミュニティNodeBotsの主催や、IoTバックエンドサービスであるMilkcocoaのエバンジェリストとしても活動中。共著: 『JavaScriptでインタラクティブ3Dコンテンツを作ろう』 共著: 『現場のプロが教える WEBデザイン 新・スタンダードテクニック37』 共著: 『フロントエンドエンジニアのための現在とこれからの必須知識』twitter: @n0bisuke URL: dotstudioのプロフィールページ

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

CodeZine(コードジン)
https://codezine.jp/article/detail/10292 2017/07/13 14:00

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー