次に、ESPr Developer をWebサーバとして動作させるためのスケッチを作成します。
リンク
クライアント（スマホ）からWebサーバ（ESPr Developer）にアクセスすると、サーバはクライアントに、前回の記事で作ったホームページ（HTMLファイル）を表示させます。
クライアント側で、ホームページ上のボタンをタップすると、その要求がサーバに送られ、サーバはそれに従って、各モータを動かすための処理を行います。
スケッチは以下のような感じです。Arduino IDEのサンプルスケッチ「Arduino」>「ファイル」>「スケッチ例」>「ESP8266WiFi」>「WiFiAccessPoint」を元にして作成しました。
// ライブラリの読み込み
#include <ESP8266WiFi.h> // ESP8266でWiFi接続するためのライブラリ
#include <ESP8266WebServer.h> // ESP8266をWebサーバにするためのライブラリ
#include <FS.h> // ESP8266のフラッシュメモリに読み書きするためのライブラリ
// 変数の定義
const char *ssid = "robot04"; // ESP8266に立ち上げるWebサーバのSSID(適当に決める)
const char *password = "testdata"; // ESP8266に立ち上げるWebサーバのパスワード(適当に決める)
const char *path_root = "/index.html"; // ESP8266のフラッシュメモリに格納しているHTMLファイル名を指定
uint8_t buf[16384]; // 読み出したHTMLファイルの内容を格納するバッファ
// ピンの割り当て(ピン番号を、分かりやすいピン名に置き換える)
#define A_AIN1 15
#define A_AIN2 13
#define A_BIN1 12
#define A_BIN2 14
#define B_AIN1 4 // B_XXXは未使用
#define B_AIN2 5
#define B_BIN1 2
ESP8266WebServer server(80); // Webサーバの設定
void handleRoot() { // クライアントから「/」リクエストを受信した時に実行する関数
if (server.method() == HTTP_POST) { // POSTで受信した場合、以下を実行
String s = server.arg("FLAG"); // FLAGの内容に応じて、各ピンのHIGH/LOWを切り替える
if (s == "FL") {
digitalWrite(A_AIN1, HIGH);
digitalWrite(A_AIN2, LOW);
digitalWrite(A_BIN1, HIGH);
digitalWrite(A_BIN2, HIGH);
} else if (s == "FF") {
digitalWrite(A_AIN1, HIGH);
digitalWrite(A_AIN2, LOW);
digitalWrite(A_BIN1, HIGH);
digitalWrite(A_BIN2, LOW);
} else if (s == "FR") {
digitalWrite(A_AIN1, HIGH);
digitalWrite(A_AIN2, HIGH);
digitalWrite(A_BIN1, HIGH);
digitalWrite(A_BIN2, LOW);
} else if (s == "SS") {
digitalWrite(A_AIN1, HIGH);
digitalWrite(A_AIN2, HIGH);
digitalWrite(A_BIN1, HIGH);
digitalWrite(A_BIN2, HIGH);
} else if (s == "BL") {
digitalWrite(A_AIN1, LOW);
digitalWrite(A_AIN2, HIGH);
digitalWrite(A_BIN1, HIGH);
digitalWrite(A_BIN2, HIGH);
} else if (s == "BB") {
digitalWrite(A_AIN1, LOW);
digitalWrite(A_AIN2, HIGH);
digitalWrite(A_BIN1, LOW);
digitalWrite(A_BIN2, HIGH);
} else if (s == "BR") {
digitalWrite(A_AIN1, HIGH);
digitalWrite(A_AIN2, HIGH);
digitalWrite(A_BIN1, LOW);
digitalWrite(A_BIN2, HIGH);
} else {
digitalWrite(A_AIN1, LOW);
digitalWrite(A_AIN2, LOW);
digitalWrite(A_BIN1, LOW);
digitalWrite(A_BIN2, LOW);
}
}
server.send(200, "text/html", (char *)buf); // クライアントにHTMLファイルを送信
}
void setup() {
pinMode(A_AIN1, OUTPUT);
pinMode(A_AIN2, OUTPUT);
pinMode(A_BIN1, OUTPUT);
pinMode(A_BIN2, OUTPUT);
pinMode(B_AIN1, OUTPUT); // B_XXXは未使用
pinMode(B_AIN2, OUTPUT);
pinMode(B_BIN1, OUTPUT);
digitalWrite(A_AIN1, LOW);
digitalWrite(A_AIN2, LOW);
digitalWrite(A_BIN1, LOW);
digitalWrite(A_BIN2, LOW);
digitalWrite(B_AIN1, LOW); // B_XXXは未使用
digitalWrite(B_AIN2, LOW);
digitalWrite(B_BIN1, LOW);
SPIFFS.begin(); // ファイルシステムを起動
File htmlFile = SPIFFS.open(path_root, "r"); // 読み込みモードでHTMLファイルを開く
size_t size = htmlFile.size(); // HTMLファイルのサイズを確認
htmlFile.read(buf, size); // HTMLファイルの内容をバッファに読み込む
htmlFile.close(); // HTMLファイルを閉じる
WiFi.softAP(ssid, password); // 設定したSSIDとパスワードでWiFiアクセスポイントを起動
IPAddress myIP = WiFi.softAPIP();
delay(500);
server.on("/", handleRoot); // クライアントからの要求に対して、実行する関数を指定
server.begin(); // Webサーバを起動
}
void loop() {
server.handleClient(); // クライアントから受け取ったリクエストを処理
}
ESPr DeveloperのFlashメモリへデータを書き込むためには、Arduino IDEに、SPIFFSファイルシステムアップローダーというものをインストールしておきます。
インストール後、スケッチと同じ場所に「data」フォルダを作り、この下に、前回の記事で作成したHTMLファイルを置きます。
この状態で「Arduino」>「ツール」>「ESP8266 Sketch Data Upload」を実行すると、HTMLファイルをFlashメモリにアップロードすることができます。なお、シリアルモニタを開いている状態ではアップロードできないようです。
この後、スケッチもESPr Developerに書き込みます。これで、ソフトウエアの準備は完了です。
つづきは こちら。
リンク