GAS(Google Apps Script)がつくりだす JavaScriptとIoTハードウェアの禁断の関係 @秋のJavaScript祭 in mixi 2017

https://javascript-fes.doorkeeper.jp/events/66335
https://github.com/pokiiio/2017-11-19_JSFES

Transcript

1. GAS(Google Apps Script)がつくりだす
   JavaScriptとIoTハードウェアの禁断の関係
   @秋のJavaScript祭 in mixi 2017
   ポキオ
   

   View Slide

2. 禁断って
   なんだよ
   

   View Slide

3. ポキオとは
   ● Androidエンジニア
   ● Twitter : @pokiiio
   ● Blog : Androidのメモとか (http://relativelayout.hatenablog.com/ )
   

   View Slide

4. IoTLT
   Connpass最大の
   IoT関係の勉強会で
   ちょいちょい登壇
   

   View Slide

5. デブサミ2017
   コミュニティ展示を
   させていただきました
   

   View Slide

6. de:code 2017
   前夜祭(day0)
   LTしてきました
   

   View Slide

7. dotstudioさんで
   記事も公開
   京急ネタです
   

   View Slide

8. ハンズオン会も
   開催してます
   IoTの楽しさを広める活動
   

   View Slide

9. KQ-IoT
   

   View Slide

10. View Slide

11. 京急は神
    *個人の感想です
    

    View Slide

12. KQ : Keikyu
    京急好きの京急好きによる京急好きのためのIoTガジェット
    俺得だっていいじゃないか、にんげんだもの
    

    View Slide

13. K:
    クソみたいな
    Q:
    クオリティ
    凝ったことはしない、最小工数でやりきる、たまに力尽く
    クソコードだって、動けばいいよ、にんげんだもの
    

    View Slide

14. KQ-IoT
    

    View Slide

15. はい
    

    View Slide

16. IoTの話
    

    View Slide

17. Wi-Fiが使える
    マイコンボードが
    いっぱいある
    

    View Slide

18. Raspberry Pi 3 Model B
    https://www.raspberrypi.org/
    ESPr Developer
    https://www.switch-science.com/catalog/2500/
    Nefry BT
    https://dotstud.io/shop/nefry-bt-single/
    ESP32-DevKitC
    http://akizukidenshi.com/catalog/g/gM-11819/
    

    View Slide

19. そもそも
    マイコンボードって
    何ができるの？
    

    View Slide

20. マイコンボード
    INPUT OUTPUT
    センサー各種
    電気信号
    時間トリガー
    LED
    スピーカー
    ディスプレイ
    電気信号
    

    View Slide

21. たとえば「リモコンの操作」
    ①ボタンを押す
    ②ボタンが押されたことを検知
    ③赤外発光ダイオードを特定の
    光らせ方で光らせる
    ④赤外発光
    ダイオードが光る
    ⑤チャンネルが変わる
    

    View Slide

22. たとえば「リモコンの操作」
    ①ボタンを押す
    ②ボタンが押されたことを検知
    ③赤外発光ダイオードを特定の
    光らせ方で光らせる
    ④赤外発光
    ダイオードが光る
    ⑤チャンネルが変わる
    INPUT OUTPUT
    それに
    応じて
    

    View Slide

23. マイコンボード
    INPUT OUTPUT
    センサー各種
    電気信号
    時間トリガー
    HTTP-GET
    LED
    スピーカー
    ディスプレイ
    電気信号
    HTTP-POST
    「HogeなINPUTがあったら、FugaなOUTPUTをする」
    みたいなロジックを自由にプログラムできる！
    Wi-Fi付きマイコンボードならHTTP-GET/POSTも！
    

    View Slide

24. このプログラミングを
    JSで行えるのが…
    

    View Slide

25. View Slide

26. JavaScriptでIoTができる！
    ● Jonny-Fiveはnode.js上で動作する
    ● JavaScriptでコーディングするとマイコンボードの
    GPIO（入出力端子）をコントロールできる
    ● node.js⇔マイコンボードはFirmataというプロトコルで通信する
    

    View Slide

27. JavaScriptでIoTができる！
    ● Jonny-Fiveはnode.js上で動作する
    ● JavaScriptでコーディングするとマイコンボードの
    GPIO（入出力端子）をコントロールできる
    ● node.js⇔マイコンボードはFirmataというプロトコルで通信する
    ただし大きな制約が
    

    View Slide

28. マイコンボードによっては母艦PC必須
    マイコンボード
    OS
    タスク タスク
    タスク
    Raspberry Pi 3 Model B
    マイコンボード
    タスク
    ESPr Developer
    Nefry BT ESP32-DevKitC
    ※マルチタスク可能な子もある
    

    View Slide

29. マイコンボードによっては母艦PC必須
    マイコンボード
    OS
    タスク タスク
    タスク
    Raspberry Pi 3 Model B
    ● Raspberry Pi上ではOSが走る
    ● OSがnode.jsやJohnny-Fiveをサポートすれば
    Raspberry Pi単体でJohnny-FiveによるGPIOの
    操作が可能
    

    View Slide

30. マイコンボードによっては母艦PC必須
    マイコンボード
    OS
    タスク タスク
    タスク
    Raspberry Pi 3 Model B
    ● Raspberry Pi上ではOSが走る
    ● OSがnode.jsやJohnny-Fiveをサポートすれば
    Raspberry Pi単体でJohnny-FiveによるGPIOの
    操作が可能
    ラズパイは大丈夫
    

    View Slide

31. マイコンボードによっては母艦PC必須
    マイコンボード
    タスク
    ● 非力なマイコンボードだとOSなし
    ● もちろんnode.jsもだめ
    ● Johnny-Fiveでプログラミングするには
    別途PC等が必要
    ● PCとマイコンボードはUSB接続 or Wi-Fi接続
    が必要
    

    View Slide

32. マイコンボードによっては母艦PC必須
    マイコンボード
    タスク
    ● 非力なマイコンボードだとOSなし
    ● もちろんnode.jsもだめ
    ● Johnny-Fiveでプログラミングするには
    別途PC等が必要
    ● PCとマイコンボードはUSB接続 or Wi-Fi接
    続が必要
    IoT感が薄れる
    

    View Slide

33. IoTでJSを
    もっと使いたいなぁ…
    

    View Slide

34. そこでGAS
    

    View Slide

35. Google Apps Script
    https://www.google.com/script/start/
    

    View Slide

36. Google Apps Script
    ● JSベース
    ● Googleが提供するサーバサイドスクリプト環境
    ● 雑に言うとGoogle版VBA：Google Suiteとの連携が簡単にできる
    ● オレオレWebAPIが無料で簡単に作れる
    

    View Slide

37. 例：電車遅延通知ガジェット
    ②HTTP-GET
    ③情報取得
    ⑤GPIOを操作
    LEDを点灯
    ①定期的に処理を開始
    ④情報をパース
    遅延情報
    サーバー
    

    View Slide

38. 例：電車遅延通知ガジェット
    ②HTTP-GET
    ③情報取得
    ⑤GPIOを操作
    LEDを点灯
    ①定期的に処理を開始
    ④情報をパース
    遅延情報
    サーバー
    AUTHとか
    あると
    だるい
    パースとか
    だるい
    

    View Slide

39. 例：電車遅延通知ガジェット
    ②HTTP-GET
    ⑥何色に
    光らせるか通知
    ⑦言われるが
    ままにLEDを
    光らせる
    ①定期的に処理を開始
    遅延情報
    サーバー
    GAS
    ③さらに
    HTTP-GET
    ④情報取得
    ⑤情報をパース
    

    View Slide

40. 例：電車遅延通知ガジェット
    ②HTTP-GET
    ⑥何色に
    光らせるか通知
    ⑦言われるが
    ままにLEDを
    光らせる
    ①定期的に処理を開始
    遅延情報
    サーバー
    GAS
    ③さらに
    HTTP-GET
    ④情報取得
    ⑤情報をパース
    面倒な処理は
    GASでやっちゃう
    マイコンは
    言われるがままに
    LEDをを光らせる
    

    View Slide

41. Pros.
    ● Google Apps Script
    ○ 無料
    ○ 簡単にAPIを作れる
    ○ JavaScript
    ● マイコンボード
    ○ マイコンで難しい処理をする必要がない
    ○ ロジック変更はGASをいじるだけ
    ○ 簡単に複数台対応できる
    

    View Slide

42. Cons.
    ● 全部JavaScriptで書けるわけではない
    ○ マイコンボード上の実装は Arduino言語を…
    ○ ちょっと長い…（なんとかライブラリ化したい）
    ● 基本的にトリガーはマイコンボードから書ける必要がある
    ○ リアルタイム性がアレ
    ○ ユースケースによっては許容できる
    

    View Slide

43. デモ
    

    View Slide

44. 構成
    ②HTTP-GET
    ③何色に光らせるか通知
    ④言われるが
    ままにLEDを
    光らせる
    ①定期的に処理を開始
    GAS
    モバイル
    ルーター経由
    

    View Slide

45. ESP8266側のコード（一部）
    #include
    #include
    #include
    #define PIN 4
    #define NUMLED 1
    #define SSID "xxxxx"
    #define PASSWORD "xxxxx"
    #define HTTPS_PORT 443
    #define HOST "script.google.com"
    #define URL "/macros/s/xxxxx/exec"
    #define FINGERPRINT "08:9E:B2:B8:77:37:3E:85:26:09:CA:29:13:D2:B0:57:26:DE:C4:6D"
    #define INTERVAL_SEC 5
    

    View Slide

46. HTTPSRedirect* client = nullptr;
    Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUMLED, PIN, NEO_RGB + NEO_KHZ800);
    void setup() {
    // Serialの初期化
    Serial.begin(115200);
    Serial.println("");
    // マイコン内蔵RGB LEDの初期化
    pixels.begin();
    // Wi-Fi接続開始
    connectWifi();
    }
    void loop() {
    // Google Apps Scriptを叩く
    String result = doRedirectGet();
    // サフィックスを念のため確認
    if (!result.startsWith("pokio")) {
    delay(INTERVAL_SEC * 1000);
    return;
    }
    // 光る
    letMeBlink(result);
    }
    続きはこちら… https://github.com/pokiiio/2017-11-19_JSFES
    

    View Slide

47. GAS側のコード
    function doGet() {
    return ContentService.createTextOutput("pokio,255,0,0");
    }
    デモでは色を決め打ちで…
    

    View Slide

48. サマリ
    ● IoTやらマイコンボードをJSで扱える環境が増えている
    ● 一番楽なのはRaspberry Pi+Johnny-Fiveだと思う
    ● GASもユースケースによっては有用
    ● マイコンボードは触らずにGASだけ触れば挙動の変更ができる
    

    View Slide

49. Thank you
    

    View Slide