javascriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp...

39
JavaScriptで ごく普通にHTTP通信をする 2015.10.30 Developers in KOBE Vol. 1 Bathtimefish 村岡 正和 ~ESP8266+EspruinoでHTTP GETリクエストをするテスト~

Upload: masakazu-muraoka

Post on 07-Feb-2017

1.908 views

Category:

Technology


2 download

TRANSCRIPT

Page 1: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

JavaScriptで ごく普通にHTTP通信をする

2015.10.30 Developers in KOBE Vol. 1Bathtimefish 村岡 正和

~ESP8266+EspruinoでHTTP GETリクエストをするテスト~

Page 2: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML5 Experts.jp メンバーGDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員など

むらおか まさかず

村岡正和

HTML5-WEST.jp

Webアプリケーション開発 IT業務システム設計/開発Webサービス導入/事業戦略コンサルティング

@bathtimefish

Page 3: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Firefox OSの 薄い本書きました。

http://goo.gl/mA8ebW

好評発売中!

開発に、「もえあがる」のはつきものだ

第一話 がいあハックス (Gaia開発環境の構築とデバッグ)

Page 4: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

また書きました。

C86

第一話 WebIDEを使いこなす (WebIDEを使ったアプリ開発法) 著

http://goo.gl/IzkT5m

Page 5: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

FirefoxOSアプリ開発のやり方書きましたhttp://codezine.jp/article/detail/8476

Page 6: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

http://kobekokaku.jp/  #kobekokaku神戸市公安9課、起動。

Page 7: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

神戸土産にはゴーフルを買いましょうhttp://www.sankei.com/region/news/150923/rgn1509230055-n1.html

Page 8: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

JS Board

Page 9: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Arduino

Espruino

Tessel

http://cylonjs.com/

https://github.com/rwaldron/johnny-five

http://www.espruino.com/

https://tessel.io/

BeagleBone Blackhttp://beagleboard.org/Products/BeagleBone+Black

http://au-fx.kddi.com/

Open Web BoardSperk corehttps://www.spark.io/

http://www.we-io.net/

WEIO

Page 10: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

オレ的JS Boardの定義

JavaScriptがネイティブで動作するデバイス

最近はJavaScriptを中心技術に据えていたら それでいいかと思いはじめた。

いやもうWeb技術っぽかったらなんでも いいかもしれない。。。

気に入ったら なんでもいい ことにした。

Page 11: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

勉強会やってます。

Page 12: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

MFT2015に出展しました。

Page 13: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

今日はJavaScriptで HTTPリクエストをする 普通のことをします。

Page 14: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

こんなかんじで。

Page 15: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

今日の材料

Page 16: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Cerevo ESP-WROOM-02 ESP8266EX

ブレイクアウトボードセット

http://cerevo.shop-pro.jp/?pid=91592223

Espruino Pico

http://www.adafruit.com/product/2621

•抵抗10kΩ x 2 •ジャンパワイヤー x4 •ブレッドボード x1 •ジャンパピン いくつか

その他

Page 17: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

http://www.espruino.com/Pico

Page 18: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

https://www.kickstarter.com/projects/gfw/espruino-javascript-for-things

http://www.espruino.com/

Page 19: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Espruino

Kickstarter発

Cortex-M3, JavaScriptネイティブな ファームウェアを実装

軽い小さい、GPIOたくさん 豊富なビルトインライブラリ

ソースコードを転送したらファームが JSをコンパイルして即実行

Page 20: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

電子工作できなくてもできる解説書いてますhttp://bathtimefish.hatenablog.com/entry/2014/12/14/161305

Page 21: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

日本語のチュートリアルも豊富http://qiita.com/advent-calendar/2014/espruino

Page 22: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

USBメモリ基盤サイズで 超小型組み込みデバイス

がJSで開発可能に

Page 23: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

ESP8266最近話題のWifiモジュール

•技適取得済み •1000円切る格安モジュール(800円くらい) •UART接続、ATコマンドで簡単操作 •Arduino + IoTホビーな人達に大人気

http://cerevo.shop-pro.jp/?pid=91592223

Page 24: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜
Page 25: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

調 理

Page 26: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Espruinoもモジュールをサポート(picoのみ)

http://www.espruino.com/ESP8266

Page 27: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

ピンレイアウト

Page 28: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

http://tech-blog.cerevo.com/archives/859/参考:

配線してみた図

GND3.3V

EN 10kΩでプルアップ RST

10kΩでプルアップ

GND

GNDTXD

Espruino B7に接続

RXD Espruino B6に接続

Page 29: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

GND3.3V

B6(Serial1 TX) ESP8266のRXを接続 B7(Serial1 RX)

ESP8266のTXを接続

Page 30: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

AT+GMRコマンドで firmwareのバージョンを 確認してバージョンに応じた モジュールを選択する

Page 31: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

ウチのは version 0.25.0.0 なので require(“ESP8266WiFi_0v25”); でいいみたい。

Page 32: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

ソースコード

1. シリアル通信オブジェクトをセットアップ

2. ESP8266にシリアル接続

3. ESP8266をリセット4. APに接続

5. HTTP GET リクエスト

7. ”data” イベントを聴いてレスポンスを取得する

6. レスポンスヘッダを取得する

Page 33: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

できた!

レスポンスヘッダ

レスポンスボディ

Page 34: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

POSTメソッドは自前で実装する必要ありhttp://qiita.com/rockymanobi/items/d50fcaf26cb59afb586b

Page 35: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

まとめ

Page 36: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

今日は普通の言語JavaScriptで 一般的なWifiをつかって HTTPリクエストする 普通のことをしました。

Page 37: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

普通すぎてすみません。

まあいろんなセンサーつけて遊ぶにしろクラウドにデータ 上がらないとIoTはじまらないんで大事っちゃ大事かもですね。( ゚д゚)

Page 38: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

これからのWeb屋は

いま、Webの専門技術を渇望しているのはソフトウェア以外の業界。 組み込みの知識を身につけ、ハードメーカーと組んでWebを中心とした サービスの企画・開発をすることが将来の仕事につながる。 という可能性がある。かもしれない。そうなるといいなぁ。

組み込みをやるべき。

Page 39: JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜

Thanks !