目次

ライブラリリファレンス

ESP32を用いてモバイル端末をリモコンとして利用するためのWiFiRemoteライブラリの仕様は次の通りです。

コンストラクタ

Webサーバーのポート番号を指定してWiFiRemotクラスの新しいインスタンスを初期化します。

定義

WiFiRemote(int httpPort)

パラメータ

httpPort Webサーバーのポート番号(通常は80を用います)

メソッド

setESPAddressメソッド

マイコンをWiFiを利用してモバイル端末からリモートで制御するためには、マイコンとWiFiが通信できるように設定する必要があります。
この設定を行うにはマイコン側のアドレスをプログラムで固定しておき、モバイル端末からアクセスできるようにする必要があります。
このメソッドはこのためのマイコン側の設定を行います。

定義

void setESPAddress(const char* ssid, const char* pass, IPAddress ip, IPAddress subnet)

パラメータ

ssid Wi-Fi通信で利用するネットワークを識別する名前を設定します。
既存のSSIDと重複しない大文字・小文字を区別した最大32文字の半角英数字で設定します。
pass Wi-Fiに接続するために必要なパスワードを設定します。
設定のためのWiFi接続は一時的なもののためパスワードを省略してもセキュリティ上の問題はありません。
ip Wi-Fiに接続するために必要なIPアドレスを設定します。
覚えやすいアドレス(例 192.168.123.45)にすることをお勧めします。
subnet Wi-Fiに接続するために必要なサブネットマスクを設定します。
通常は255.255.255.0で構いません。

setCallbackメソッド

このライブラリから呼び出されるコールバック関数を登録します。
コールバック関数の詳細はコールバック関数をご覧ください。

定義

void setCallback(void (*onConnecting)(byte), void (*onNotify)(const char *), const char* (*onInquire)(const char*))

パラメータ

onConnecting WiFiリモコンライブラリがWiFiネットワークと接続と試みている間に0.5秒間隔で呼び出される関数です。
onNotify リモート端末より通知があったときに呼び出される関数です。
onInquire リモート端末より問合せがあったときに呼び出される関数です。

beginメソッド

WiFiRemoteの処理を開始します。

定義

void begin(bool initialize)

パラメータ

initialize TRUEの場合は既存のWiFi接続設定を初期化し、再設定してから実行ます。
実装ではマイコンに初期化用のボタンを設け、ボタンが押されていれば初期化するようにするとよいでしょう。

コールバック関数

ライブラリより呼び出される関数をarduinoプログラムに記述します。
作られた関数の名前をsetCallbackメソッドのパラメータとして設定します。
コールバック関数は必要に応じてライブラリより呼び出されます。

(注)関数名とパラメータ名は任意の名前で構いません。戻り値及びパラメータの型は定義に一致する必要があります。

onConnecting

WiFiリモコンライブラリがWiFiネットワークと接続と試みている間に0.5秒間隔で呼び出される関数です。

定義

void onConnecting(byte onoff)

パラメータ

onoff WiFi接続試行中は0と1が交互に設定されます。
最終的に接続に成功すれば1、失敗すれば0が設定されます。
マイコン側はこれを用いてLEDを点滅させるなどしてWiFi接続試行中であることを示すことに利用できます。

プログラム例

// 接続試行中は接続LEDと未接続LEDが交互に点滅します。
// 最終的に接続LEDまたは未接続LEDのどちらかが点灯します。
void onConnecting(byte onoff)
{
  digitalWrite(UNCONNECTED, onoff == 0 ? HIGH : LOW);
  digitalWrite(CONNECTED, onoff == 1 ? HIGH : LOW);
}

onNotify

リモート端末より通知があったときに呼び出される関数です。
リモート端末のユーザーインターフェースでの入力など、リモート端末の状態が変更したときに呼び出されます。

定義

void onNotify(const char *notice)

パラメータ

notice リモート端末より通知される文字列のポインタ。
文字列の形式は端末とマイコン側で取り決めて下さい。

プログラム例

リモート端末の２つのボタンのいずれか押されたときに通知"0"jまちは"1"を受けとります。
通知が"1"の時LEDを点灯し、通知が"0"の時LEDを消灯します。

void onNotify(const char *notice)
{
  digitalWrite(LED, strcmp(notice, "1") == 0 ? LOW : HIGH);
}

WEB側の処理

リモート端末は通知を送るためにブラウザに表示されたHTML内のJava Scriptを用います。
サーバー(マイコン)に通知を送信するには XMLHttpReques を用いて POST メソッドで アドレス /notify に非同期(true)で送信します。
これは定型的に次のようなコードとなります。

	var xhr = new XMLHttpRequest()
	xhr.open("POST", "/notify", true)
	xhr.setRequestHeader("Content-Type", "text/plain")
	xhr.send(通知メッセージ)

HTML例

ブラウザ画面にONボタンとOFFボタンがあり、それぞれ押されたときに引数1と0でbuttonClickを実行します。

	<button onclick="buttonClick(0)">ON</button>
	<button onclick="buttonClick(1)">OFF</button>

Java ScriptでbuttonClick関数を定義します。

<script>
	function buttonClick(onoff) {
		var xhr = new XMLHttpRequest()
		xhr.open("POST", "/notify", true)
		xhr.setRequestHeader("Content-Type", "text/plain")
		xhr.send(String(onoff))
	}
</script>

onInquire

リモート端末よりマイコン側の状態の問合せがあったときに呼び出される関数です。

定義

const char* onInquire(const char* kind)

パラメータ

kind リモート端末よりの問い合わせの種類を識別するための文字列のポインタ。
問い合わせが一種類しかない場合はNULLでもよい

戻り値

const char*  問い合わせに対する応答文字列のポインタ
文字列の形式は端末とマイコン側で取り決めて下さい。

プログラム例

リモート端末より問合せに応答します。
問合せにの種別が"switch"の場合にタクトスイッチの状態を返します。

const char* onInquire(const char* kind)
{
    if (strcmp(kind, "switch") == 0)
    {
      return digitalRead(SW) == HIGH ? "1" : "0";
    }
    return "";
}

WEB側の処理

リモート端末は問い合わせを処理するためにブラウザに表示されたHTML内のJava Scriptを用います。
サーバー(マイコン)に問い合わせを送信するには XMLHttpReques を用いて POST メソッドで アドレス /inquireに非同期(true)で送信します。
これは定型的に次のようなコードとなります。

	var xhr = new XMLHttpRequest();
	xhr.open("POST", "/inquire", true);
	xhr.setRequestHeader("Content-Type", "text/plain")
	xhr.send(問い合わせ識別);

HTML例

マイコンのタクトスイッチの押下状態をブラウザ画面に表示します。
問い合わせ用の関数は次のようになります。

<script>
	function getSwitch() {
		var xhr = new XMLHttpRequest();
		(応答処理)
		xhr.open("POST", "/inquire", true);
		xhr.send("switch");
	}

問い合わせの処理では問い合わせに対する応答を処理する必要があります。
問い合わせのに対する応答があった場合に readystatechange イベントが発生します。
readystatechange イベントを処理する関数を定義します。
その中で、リクエスト状態(readyState)が操作が完了した(4)ことと、レスポンス(status)が成功(200)したこと確認して下さい。
また、レスポンスはテキストはresponseTextとして入ってきますので、それを参照してブラウザの表示を変更する等の処理を行います。
上記スクリプトの(応答処理)の部分は次のようになります。

		xhr.onreadystatechange = function () {
			if (this.readyState == 4 && this.status == 200 && this.responseText.length == 1) {
				var res = this.responseText;
				var sw = document.getElementById("sw");
				sw.textContent = res == "0" ? "OFF" : "ON";
			}
		};

マイコンの状態を監視するには問い合わせ用の関数を0.2秒間隔で呼び出します。

	setInterval(getSwitch, 200) ;