自作キーボードのためにサーバーサイドを書いた話

TL;DR

無線キーボードを作りたかったので、ESP32で無線キーボード作った。

キーコンフィグも無線で出来たら面白そう。

ESP32でサーバー立てて、ブラウザからキーコンフィグ出来るようにした。

できたもの

PCから

スマホから

WiFi接続時にログインページを開く仕組みを利用しています。

ハード(自作したテンキー)

しくみ

キーコンフィグモード

SPIFFS(ESP32内Flashメモリ)

                     |   ↑

                   ↓   |

ESP32(WiFi.softAP ESPAsyncWebServer)

                     |   ↑

 GET JSON |     | POST JSON

                   ↓   |

ブラウザ(スマホなど)

 

キーコンフィグなどのユーザー設定は、JSONの形で保存しています。

キーボードモード

SPIFFS(ESP32内Flashメモリ)

                     | 

                   ↓ 

ESP32(BleKeyboard ArduinoJson)

                     | 

    NimBle    |   

                   ↓ 

スマホやPC

 

キーコンフィグ等のユーザ設定を記載したJSONを、読み書きしています。

 

JSONを受け取ってメモリに書き込むコード(抜粋)

void handleBody(AsyncWebServerRequest *request, uint8_t *data, size_t len, size_t index, size_t total){

  if(!index){

    request->_tempFile = SPIFFS.open("/keymap.json", "w");

  }

  request->_tempFile.write(data, len);

  if(index + len == total){

    request->_tempFile.close();

    request->send(200, "text/plain", "Write keymap.json success.");

  }

}

 

void webServerSetup()

{

  server.serveStatic("/", SPIFFS, "/").setDefaultFile("index.html");

  server.on(

    "/post",

    HTTP_POST,

    (AsyncWebServerRequest* request){

      request->send(200, "text/plain", "keymap.json posted.");

    },

    handleUpload,

    handleBody

  );

 

  server.onNotFound((AsyncWebServerRequest *request)

  {

    String redirectUrl = "http://";

    redirectUrl += WiFi.softAPIP().toString();

    redirectUrl += "/";

    request->redirect(redirectUrl);

  });

 

  server.begin();

}

ここが一番苦労しました。

 

公式のリファレンスで紹介されている AsyncCallbackJsonWebHandler

が上手く動作しなかったため、単にJSONフォーマットに則っている文字列として扱うようにしています。

コード全文(gitリポジトリ)

宣伝

コミックマーケット101 2日目西せ04b に、ここで紹介したテンキーの完成品をいくつか持っていっています。

良ければ触りに来てください。