こんばんは。
Twitter でもつぶやいていますが、前回の記事で、Arduino – ESP32 のWiFiClientSecure ライブラリで、数十回～200回程度、Web へ定期的に connect していると固まる現象が解決できなかったので、諦めて次に進もうと思います。
で、今回は、スマホアプリについて紹介します。
ある程度、聞いてはいたけど、実際使ってみて
「知らなかった～・・・」
という驚きのアプリの話題です。
Twitter の@ H0meMadeGarbage さんが Blynk というスマホアプリで ESP32 をリアルタイムコントロールしているのを見て、こんなに追従してくれるのなら自分も試してみようと思い立ったわけです。
H0meMadeGarbageさんの以下のブログ記事もご参照ください。
http://homemadegarbage.0t0.jp/pov-sphere08
Blynk というアプリは今までいろいろな方が使っているのはネットで見てはいたのですが、いつくかのアイテムが無料で、追加すると有料というところが、私にとっては敷居が高く、使おうという気にはなれなかったんです。
以前、私は自作ライブラリを作って、ESP32 と Wi-Fi リアルタイム双方向通信をやったことがあります。
以下の２つの記事をご参照ください。
ESP32 -DevKitC ( ESP-WROOM-32 )でスマホとWi-Fi リアルタイム双方向同時通信
オブジェの LED カラー を スマホ ブラウザ で WiFi リアルタイム コントロール してみた
これである程度満足していましたし、果たして同じようにここまで追従するのかという疑問もあって、今まで手を付けずにいました。
ところが、ところが・・・、
実際やってみると、何とも・・・、GREAT!!!
実にスバラシかったんです。
一番感動したのは、ローカルエリアだけでなく、3G や 4G 回線を使って、世界中のどこからでもリアルタイム操作が可能なことです。
ネットのつながる Wi-Fi環境さえあれば、地球の裏側からでも操作可能です。
しかも、リアルタイム双方向同時通信です。
クラウド系アプリというと、リアルタイム性は無く、連続データ送受信はまだ無理だろうと思っていました。
しかし、やってみると、意外とイイんです。
トラフィックを軽減するために、インターバルは長めですが、3G、4G回線などを使って地球の裏側から操作するには十分な追従性です。
私が作った Websocket ライブラリでは、ローカルエリアネットワーク(LAN) のみの対応だったので、これは新鮮でした。
しかも、Arduino スケッチも簡単！！！
それに、もう一つ特筆すべきは、複数の端末から同時に操作できて、複数の端末にセンサー値が返ってくるんです。
いゃぁ～・・・、これには参りましたね。
自分でそれを作って実現しようとすると、途方もない作業になります。
お見事！！！
やはり、実際にやってみるのとやってみないのとでは大違いですね。
改めて実感した次第です。
では、これの使い方を説明してみようと思います。
準備するもの
ESP32 – DevKitC ( ESP-WROOM-32 開発ボード )
私は秋月電子通商さんで購入しましたが、Amazonさんでも以下の販売店にありました。
CdSセル １ＭΩ GL5528
手元にあったものを使いましたが、Amazon.co.jp では以下で販売していました。
因みに私はここでは買ったことがありません。
定電流ダイオード E-103
マルツさん販売の定電流ダイオードがお勧めです。
10mAです。
1/4W 100kΩ程度の固定抵抗
100kΩ程度なら何でもよいと思います。
ブレッドボード SAD-101 (サンハヤト)
このブレッドボードは ESP32-DevKitC を載せても、片側１列、もう片側２列空くのでとても重宝しています。
日東 自己融着粘着テープ
電気工事でよく使うブチルゴムテープです。
LEDとCdSセルをくっつける時に使います。
ビニールテープみたいに粘着剤でくっつけるのではなく、粘土みたいに融着できるので便利です。
出来るだけ高速CPU の最新スマホ
双方向リアルタイム通信を行う為、出来るだけ最新の高性能CPU スマートフォンが良いです。
インターネットにつながった Wi-Fi ルーター環境
事前にインターネットにつながった Wi-Fi ルーター（アクセスポイント）環境は構築しておいてください。
インターネットにつながっていないと、Blynk が動作しません。
それに、ESP32 – DevKitC がセキュリティーで弾かれないように、ファイアウォールやMACアドレスフィルタリングなどの設定は済ませておいてください。
ジャンパーワイヤー、パソコン、USBケーブル等
ESP32 – DevKitC の接続
GPIO に接続した LED の明るさを光センサーの CdS セルを通して電圧値を AD コンバーターで読み取るという簡単な回路です。
実際に接続した写真はこんな感じです。
CdSセルに自己融着テープでくっ付けています。
これは、外部の光を遮断して、LED の光だけセンサー値に反映させたいためです。
それでも環境光に影響されてしまいます。
付け方は以下の記事を参照してください。
ESP32 -DevKitC ( ESP-WROOM-32 )でスマホとWi-Fi リアルタイム双方向同時通信
Blynk について
まだ使い始めて間もなく、良く分からないのですが、ザッと説明します。
本家のページは以下のリンクです。
2015年2月から「KickStarter」で資金を募集してできたプロジェクトらしく、オープンソースライセンスの MIT だそうです。
通信は、昨今の流行りのクラウドサーバーを経由して行います。
大まかな概念図は以下のような感じです。
Blynk専用クラウドサーバーを経由しますので、ネットが繋がるWi-Fi 環境さえあれば、世界中のどの地域からでも通信が可能です。
Bluetooth 通信も可能らしいのですが、私はまだ試していません。
アプリは、Android と iPhone 用がありますが、デスクトップやノートパソコンは基本的に操作できません。
スマホアプリは無料でインストールすることができ、数種類のアイテムならば無料で使うことが出来ます。
それ以上アイテムが必要な場合は有料になります。
そして、ESP32 や ESP8266 は Arduino で開発ができます。
Arduino ライブラリをインストールする必要があります。
スマホにBlynk アプリをインストール
まず、Android スマホの場合は Play ストアから以下のリンクをタッチしてください。
インストールは無料で、数種類のアイテムを無料で使うことができます。
iPhone の場合は App Store から以下のページをタッチしてください。
こちらもインストールは無料で数種類のアイテムを無料で使うことができます。
以下、インストール方法は Android （アンドロイド）で説明します。
Play ストアで、以下のようにインストールをタッチして、インストールします。
終了後は「開く」をタッチします。
スマホ側 Blynk の設定
アカウントの登録
まずは、Blynk アカウントを作成します。
Facebook アカウントを使わない場合で説明します。
ご自分のメールアドレスを用意し、パスワードを事前に考えておいて、下図の様に入力してください。
Sign UP をタッチすると登録完了し、すぐにプロジェクト作成画面へ移行します。
新規プロジェクトの作成
まず最初に、プロジェクトというものを作成しなければなりません。
下図の様に、「New Project」をタッチ
次に、下図の様にプロジェクト名を好きな名前で入力し、Device は ESP32 Dev Board を選択してください。
次に、Connection Type を WiFi にして、「Create」ボタンをタッチすると下図の様なメッセージウィンドウが表示されます。
「ＯＫ」をタッチすると、ご自分のメールアドレスに Auth コードが送られてきます。
下図が送られてきたメールの内容です。
Auth コードは Arduino スケッチに入力するものですので、大切に保管しておいてください。
もし、無くした場合はプロジェクトを新たに作り直せば、また別の Auth コードが送られてくるので、あまりシビアになる必要はありません。
スマホから送信するコントローラーの設置
次に、スマホ側から操作するコントローラーを設置します。
ここでは、LED を連続調光コントロールするためのスライダーを設置してみます。
test という名前のプロジェクトを作成すると、下図の左のようになり、タッチするなりスワイプするなりするとアイテムが表示されます。
そして、下図の様に「 Slider 」をタッチするとスライダーが自動配置されます。
再度、空白にタッチするなり、スワイプさせると、下図の様に電池マークの Energy が減っています。
Slider は 200 Energy なので、残り 1800 Energy となっています。
つまり、2,000 Energy まで無料で使えますので、それ以上使いたい場合は「+Add」ボタンをタッチして追加すればよいわけです。
スライダーアイテムをタッチすると、下図の様に設定画面が出てきますので、OUTPUT のところのPIN のところをタッチします。
すると下図の様な画面になるので、Virtual の V0 に設定します。
これは、後で述べる Arduino IDE スケッチで使うハンドル名です。
スライダーを操作する毎に送信するデータは 100ms のインターバルを置いて送信するようにします。
これが最速です。
それ以外に PUSH というものがあるのですが、通信トラフィックを圧迫して、まともに操作できないので、100ms 以上にします。
LED は スケッチ上で sigmaDelta 関数を使うので、0-255 の範囲の値としておきます。
次に、下図の様にアイテムを長押しすると、位置を自由に変えられ、大きさも変えられます。
これは便利ですね。
ESP32 側からの受信データを表示するアイテムの設置
では、ESP32 – DevKitC 側から送信されてくるデータを表示させるアイテムを設置していきます。
例えば、下図の様に Level H というアイテムを選択します。
これは、水平表示のレベルメーターです。
そして、アイテムを長押しして好きな位置と大きさに設定し、下図の様に Virtual を V1 にします。
センサー値はとりあえず下図の様にしておいて、後で LED の明るさを見ながら調整していきます。
Reading Rate は 1秒以上に設定します。
通信トラフィックを軽減させるためには 1秒以上ないとフリーズしてしまうので、止むを得ないでしょう。
また、下図の様にアイテムの色を変えることができますので、いろいろ試してみて下さい。
Arduino IDE および、Arduino core for the ESP32のインストール
Arduino IDE は 1.8.2 で動作確認しましたのでそれをインストールすることをお勧めします。
Arduino core for the ESP32 のインストール方法については以下の記事を参照してください。
Arduino core for the ESP32 は最新版を使うようにしてください。
頻繁に更新されていますので要注意です。
Arduino core for the ESP32 のインストール方法
Arduino IDE に Blynk ライブラリをインストールする
今度は Arduino IDE に Blynk ライブラリをインストールします。
先ほど、スマホに Blynk アプリをインストールしてプロジェクトを作成した時に送られてきたメールを見てみて、そこに下図の様にライブラリのリンクがありますので、そこをクリックします。
すると、ZIPファイルが自動ダウンロードされます。
(Windows の場合)
そのZIP ファイルを以下の記事を参照して、Arduino IDE にインストールしてください。
GitHubにある ZIP形式ライブラリ のインストール方法 ( Arduino IDE )
ただし、この場合は ZIP ファイルを直接インストールできないようです。
その場合、ZIPファイルを解凍すると、libraries とtools フォルダがありますので、それをコピーする必要があります。
Windows 10 の場合、以下のようなパスになります。
C:\Users\ユーザー\Documents\Arduino\libraries
C:\Users\ユーザー\Documents\Arduino\tools
そこに下図の様な必要なファイルをコピーすればインストール完了です。
その後、Arduino IDE を起動してください。
Arduino IDE にスケッチを入力
では、Arduino IDE に以下のサンプルスケッチを入力してみてください。
#define BLYNK_PRINT Serial
#include <WiFi.h>
#include <WiFiClient.h>
#include <BlynkSimpleEsp32.h>
char auth[] = "xxxxxxxxxxxxx"; //Blynkから送られてきたメール内にある Auth コード
char ssid[] = "xxxx"; //ご自分のルーターの SSID
char pass[] = "xxxx"; //ご自分のルーターのパスワード
const uint8_t LED_pin = 27; //LED GPIO #27
const uint8_t ADC_pin = 34; //AD converter GPIO #34
void setup()
{
Serial.begin(115200);
Blynk.begin(auth, ssid, pass);
sigmaDeltaSetup(0, 312500);
sigmaDeltaAttachPin(LED_pin, 0);
sigmaDeltaWrite(0, 0); // LED OFF ( level 0 )
}
void loop()
{
Blynk.run();
}
BLYNK_WRITE(V0){
//スマホ側 Blynk アプリで設定したスライダー値の受信
int LED_level = param[0].asInt();
sigmaDeltaWrite(0, LED_level);
Serial.printf("LEDpin#%d = %d\r\n", LED_pin, LED_level);
}
BLYNK_READ(V1){
//スマホ側 Blynk アプリで設置したレベルメーターに ADC値を送信
int adc = analogRead(ADC_pin);
Blynk.virtualWrite(V1, adc);
Serial.printf("adc = %d\r\n", adc);
}
【解説】
●1-5行目：
これは、Blynk のサンプルスケッチそのままです。
●7行目：
ここで、先ほど説明した Blynk から送られてきたメールにある、Auth コードを入力します。
●20-22行：
LED をPWM 制御して明るさをコントロールするための関数です。
Arduino core for the ESP32 のサンプルスケッチを流用しました。
●30-36行：
ここで、スマホ側の Blynk アプリで設置したスライダーから送られてきたデータを受信して、それを sigmaDeltaWrite 関数へ代入して、LED を調光させます。
シリアルモニターにも値を出力しています。
この関数で V0 という値を持っていて、スマホBlynkアプリのスライダーの V0 とリンクしているわけです。
●38-44行：
ここで V1 という値を持っていて、スマホBlynk アプリ側のレベルメーターの V1 とリンクしています。
光センサーの CdS セルを通した電圧値をGPIO #34 で読み取り、analogRead で 12bit ADコンバーターで変換します。
それを41行でスマホ側へ送信しているわけです。
ここでも V1 という値が使われていることに注意してください。
以上、スケッチはとってもシンプルで簡単ですね。
コンパイル書き込み実行
では、インターネットにつながった Wi-Fi ルーターを立ち上げて、しばらく経ってからコンパイル書き込みおよび実行してみてください。
ルーターの設定のファイアウォールや、MACアドレスフィルタリングを設定している方は、ESP32 – DevKitC が弾かれないように設定しておいてください。
コンパイル終了して、間髪入れずにシリアルモニターを 115200bps で起動するとこうなります。
こんな感じで表示されれば、ESP32 ( ESP-WROOM-32 )と Blynk サーバーと通信ができているということになります。
次に、スマホ Blynk アプリ上で下図の様なところをタッチして操作してみてください。
すると、ESP32 ( ESP-WROOM-32 )と通信開始します。
停止する場合は下図の四角をタッチすると停止します。
では、これの動作している様子を動画でご覧ください。
レベルメーターやスライダーの最小値や最大値を途中で修正している様子が分かると思います。
使っているスマホは、Android 7.0 で、
SONY Xperia X Performance SO-04H
です。
いかがでしょうか。
最小値、最大値の値修正も簡単ですね。
ほんとに素晴らしいアプリだと思います。
では、複数の端末でこれを操作したらどうなるのでしょうか？
以下の動画をご覧ください。
手前のスマホが4G 回線で、もう一つがインターネットにつながった Wi-Fi 回線で接続されています。
使っているもう一方のスマホは、３年前の Android 6 スマホです。
どうですか？
これ、素晴らし過ぎませんか？
他の端末もプロジェクトが同じならば値が即座に更新されていますね。
4G回線は多少追従性が悪いですが、これだけ追従していれば文句なしです。
これができれば、いろいろなリモートコントロールが想像できますね。
いゃぁ～・・・スゴイっす！！！
まとめ
いかがでしたでしょうか？
このBlynk というアプリは今まで見向きもしなかったのですが、使ってみるとあまりの素晴らしさに感動してしまいました。
もっとリアルタイム性があっても良いかと思いましたが、3G、4G回線を使ってもある程度追従していて、複数端末のデータも即座に更新されるとあれば、「あっぱれ」としか言いようがありません。
自分もこんなアプリを作りたかったんだと思いました。
双方向通信の WebSocket ライブラリを作ったりしましたが、やはり通信トラフィックがネックで、インターバルを取って通信しないと双方向通信は難しいんだということが改めて分かりました。
私が作っていたことと同じセオリーでこのBlynkアプリが作られていて、
「やっぱりそうなんだ！」と納得しながら使っていた次第です。
とりあえず、これを使えば、地球の裏側のデバイスとリアルタイム双方向通信ができますね。
介護や農業分野にも大いに役立ちそうです。
Blynk の他にもクラウド系アプリが沢山ありますが、これは大変な世の中になったものだと実感した次第です。
ということで、今回はここまでです。
ではまた・・・。
mgo-tec電子工作 関連コンテンツ ( 広告含む )Amazon.co.jp 当ブログのおすすめ
