Johnny-FiveもどきをGoogle Apps Scriptで作ってESP8266を光らせてみた

・Google Apps ScriptのWebAPIで、ESP8266が光らせるLEDの色を指定する
http://relativelayout.hatenablog.com/entry/2017/06/25/002632

・Google Apps Scriptから色んな鉄道の遅延情報を取得する
http://relativelayout.hatenablog.com/entry/2017/07/20/005129

Transcript

1. Johnny-Fiveもどきを Google Apps Scriptで作って ESP8266を光らせてみた ポキオ
2. ポキオ • Androidエンジニア • Twitter : @pokiiio • Blog : Androidのメモとか (http://relativelayout.hatenablog.com/ )
3. デブサミ2017 コミュニティ展示を させていただきました
4. de:code 2017 前夜祭(day0) LTしてきました
5. dotstudioさんで 記事も公開 京急ネタです
6. a.k.a. 京急の人
7. 京急は神
8. 今日言いたいことの半分を話した
9. "Johnny-Five"
10. http://johnny-five.io/
11. USB接続 / Wi-Fi Firmataで GPIOにアクセス ホストマシンでの処理 JSで コードを書く node.jsで 実行
12. JavaScript すごーい
13. Johnny-Five Pros • JSでボードを動かせる • 他のJSのライブラリを組み合わせて夢が広がる • いちいちボードにファームを流し込まなくても大丈夫 • Arduinoだけでなく、ESP8266、RPi、・・・色々なボードに対応 Cons • Aduinoなどではホストマシンが必要になる USB接続(もしくはWi-Fi接続で同一ネットワーク内にいる)が必要
14. USB接続 / Wi-Fi Firmataで GPIOにアクセス ホストマシンでの処理 JSで コードを書く node.jsで 実行 このあたりをクラウドに 持っていったらどうか？
15. そこでGAS
16. https://www.google.com/script/start/
17. Google Apps Script • Google Apps Script is a JavaScript cloud scripting language that provides easy ways to automate tasks across Google products and third party services and build web applications. • VBAのGoogle版みたいな感じ • Web上でコーディング、実行ができる • WebAPIとしてPublishもできる
18. Wi-Fi WebAPIを叩く GPIOの値をPOST GETした値に応じてGPIOを制御 Googleの サーバー上での処理 WAN GASでコードを書く WebAPIとして公開 こういうことが できるのでは メインの ロジックは こっちに書く
19. 作ってみた
20. 構成 ESP8266 GAS 鉄道遅延情報 ①WebAPIを叩く (HTTP-GET) ②鉄道が遅延してるか 確認する ③結果を取得、パース ④何色に光らせるか レスポンスを返す ⑤GASの 言うとおりに 光らせる
21. 構成 ESP8266 GAS 鉄道遅延情報 ①WebAPIを叩く (HTTP-GET) ②鉄道が遅延してるか 確認する ③結果を取得、パース ④何色に光らせるか レスポンスを返す ⑤GASの 言うとおりに 光らせる メインの 難しいロジックは ぜんぶGASがやる マイコン側は GASの 言うとおりに GPIOを操作
22. コード (GAS) LEDの色の指定 - pokioはプレフィックス - 続けてRGBの値 遅延しているかの判断 - 遅延路線の一覧を取得 - 京急線があるかパース HTTP-GETされたときの Responseを記載
23. コード (ESP8266、一部) GASはHTTPS接続 - APIのアドレスを記載 - 認証の為のFingerprint 基本的な流れ - Wi-Fi接続 - HTTP-GET - Wi-Fi切断 - Responseをパース - LEDを光らせる - ・・・の繰り返し
24. コード (ESP8266、一部) GASはリダイレクトされる - リダイレクトに対応した HTTPSRedirectを使用
25. "モノ"も作ったよ
26. ﾀﾞｧｼｴﾘｲｪｽなIoT ﾀﾞｧｼｴﾘｲｪｽなIoT 2nd Gen ﾀﾞｧｼｴﾘｲｪｽなIoT 3rd Gen (NEW)
27. 品川駅の鉄道をほぼ網羅 遅延すると光る 京急線 (赤く光る) 山手線 (黄緑色に光る) 京浜東北線 (水色に光る) 東海道線 (オレンジ色に光る) 横須賀線 (青く光る) 専用のお立ち台を作成 IoTLT vol.28@サイボウズで 紹介したポキオ基板 x 5
28. 光るかな？
29. サマリ • ESP8266とGASを組み合わせてLチカした • ロジックはすべてGASが担う • ロジック変更も簡単(いちいち流し込まなくてOK) • GASはJSで書けるので夢が広がる、G Suiteとの連携も簡単 • Arduino IDEではやりづらい処理がGASだと簡単に書ける気がする • ただし、HTTPのトリガーはESP8266からしかかけられない(UXが限られる) • 遅延しないほうがいい
30. THANK YOU