ESP32でWiFi化したSTM32にブラウザから操作する

無線モジュールESP32を使って Nucleo(STM32) を無線 (WiFi) 化し、WEBサーバーを構成します クライアント側 であるPCやスマホのウェブブラウザからマイコン側に文字列のコマンドコードを送ってリモート操作するアプリを紹介します。ESP32とブラウザの設定および送受信については「ESP32でWiFi化したNucleo(STM32)をブラウザでリモート操作」で詳細を解説しています。

WEBサーバーを構成する上での注意点

めかのとろ

プログラム構成の基本的なところは「ESP32を使ったSTM32のTCP通信(WiFi)受信編」 と似ていますが、ESP32をHTTPプロトコルで受信する場合に特有なクセに注意する必要があります。

めかのとろ

通信条件がTCPからHTTPに変更になったことに応じてプログラムの基本構成はTCP通信の場合とほとんど同じままで、サーバーのポート番号プロトコルフォーマットを変更しただけのものであると、ターミナルからでは正常に動作するのにブラウザから WEBサーバー化したESP32へのHTTP通信はうまくいきませんでした。

めかのとろ

TCP通信プロトコルでPCやスマホのターミナルソフトからSTM32へコードを送るのと、HTTP通信プロトコルでウェブブラウザからSTM32へコードを送るのは一見ほぼ同じに思えますが、中間にあるESP32の挙動がかなり違うために動作を理解しないままではうまくいきません。

めかのとろ

相違点をまとめると以下のようになります。

  • ウェブブラウザからのHTTP通信プロトコルでは ESP32は ブラウザを開く、閉じるだけでも応答を返す
  • ブラウザからコマンドを与えるのは、IPアドレスにコマンドを付属させるため(IPアドレス/コマンドコード)、都度接続を閉じたり、つなげたりすることになります。そのため、応答(0,CLOSED/0,CONNECT)も都度付加される
  • ちょっとしたコードを送るだけでも、応答文字列はかなり長い。(下の赤で囲まれた部分)
  • 応答文字列も長い分、ATコマンド前後の待ち時間も大きめに設定する。
めかのとろ

つまり、ブラウザから文字コードを送信すると、想定以上にESP32は応答を返すので予め想定しておかなければマイコン側では多くのものを予期せぬタイミングで受信することになります。これが時にフリーズの原因にもなりえます。

めかのとろ

そういうものであることを分かってしまえば対処のしようもあるのですが、はじめは原因がわからなかったために問題解決に至り安定した通信を実現できるようになるまでかなり時間を要しました。

めかのとろ

以下に、ESP32をHTTP通信プロトコルで安定して文字コードを送るコツを解説します。

プログラム構成

HTTP通信プロトコルによる受信構成図
めかのとろ

受信構成はTCP通信の場合と同じでもよいのですが、サンプルアプリでは割り込み受信を使用しており、割り込みが入った時点が分かるようにLEDを点灯させています。

めかのとろ

不定のタイミングで受信が発生する場合はポーリングによるものよりも割り込みにした方が確実です。ポーリング方式でも試してみましたが安定した動作を得ることはできませんでした。

割り込み受信処理
めかのとろ

このアプリの特徴は割り込みが発生して受信処理をする度に一旦USARTを初期化してレジスタをクリアにすることです。クリアにはいろいろな方法があるとは思いますが、ここでは最も初歩的で簡単なクリアを実現するために、リセット関数を下記のようにまとめて実行させています。

めかのとろ

リセット処理を受信のたびにきっちり施すことで、通信エラーなどがクリアされ動作が安定しました。これで、ブラウザからコードにより処理を分岐させることができるようになりましたので、さまざまなリモートアプリに発展させることが可能になります。

めかのとろ

種々のコードを含んだIPアドレスをリンクとしてHTMLページに貼り付けておけば、それをクリックするとコードがブラウザからマイコン側に転送されることになります。

USARTの初期化
コラム

今回はTCP通信で行っている簡易的なコード受信をHTTP通信プロトコルで行うサンプルを紹介しました。ちょっとしたリモート操作ではこれでも十分だと思います。
ただ、HTTP通信プロトコルをATコマンドで行うのは、文字コード長を指定する必要があったり、制約があるため煩わしいのも確かです。ESP32で本格的にHTTP通信を行う場合は透過 (トランスペアレント) モードでATコマンドによらずマイコン側とシームレスな通信を行うこともできるのでさらに発展させたい場合は挑戦してみてください。