Bei einem ESP8266-Projekt benötigt man nicht selten ein Web-Interface zur Datenanzeige oder zur Außensteuerung. Nachdem ich die Vorzüge der ESPAsyncWebServer-Bibliothek kennengelernt hatte, habe ich beschlossen, diese nach Möglichkeit einzusetzen. Dann macht es natürlich Sinn, einige immer wieder benutzte Seiten, wie z.B. die Außensteuerung zu standardisieren.
Die im folgenden beschriebene Bibliothek implementiert
| Version | Anpassungen |
|---|---|
| 1.0 (2018-01-15) | Basis-Version |
| 1.1 (2018-03-09) | Platzhalter %title% und %headline% für config.html und spiffs.html eingefügt |
| 2.0 (2018-10-03) | Web-Server und Web-Sites getrennt. |
| 2.1 (2020-07-28) | Compiler-Warnungen behoben. |
Die Klasse UrsAsyncWebServer ist eine öffentliche (public) Ableitung der AsyncWebServer-Klasse. Alle Methoden der Basisklasse stehen zur Verfügung. Die Basis-Klasse ermöglicht die Registrierung einer Handler-Funktion für nicht gefundene Dateien. In UrsAsyncWebServer ist ein konkreter Handler implementiert. Details zur Klasse
Die Klasse UrsAsyncWebSite ist Basis-Klasse für an den Web-Server gekoppelte Seiten. Hiermit erstellte Seiten können mit einem geschützten Zugang versehen werden. Zugangsdaten werden über eine Instanz der Klasse UrsAsyncRealm übergeben. Details zu den Klassen
Die Klasse UrsAsyncFSHelper stellt statische Hilfsmethoden bereit. Die wichtigste ist ein File-Upload-Handler zum Einbinden in eigene Web-Sites, mit dem Dateien per Web-Interface ins SPIFFS hochgeladen werden können. Details zur Klasse
UrsAsyncSpiffsEditorClass, eine Seite zum Up- und Download von Dateien in das und aus dem SPIFFS, und UrsAsyncConfigEditorClass, eine Seite zur Pflege von Außensteuerungsparametern, sind zwei implementierte Web-Sites. Interne Methoden behandeln Anfragen zu den HTML-Dateien "/spiffs.html" und "/config.html", die im SPIFFS vorliegen müssen.
Die Dateien "/spiffs.html" und "/config.html" sind kein eigentlicher Teil der Bibliothek und können daher projektspezifisch angepasst werden (z.B. die Überschriften). Die folgende Dokumentation und das Beispiel enthält Muster für beide Dateien. Details zum SPIFFS-Editor Details zum Konfigurationseditor
In der Regel wird die UrsAsyncWebServerBaseClass abgeleitet und mit projektspezifischen Elementen, z.B. den zugehörigen Web-Sites versehen. Das Beispiel 1 zeigt ein einfaches Beispiel für den Einstieg.
Das Beispiel 2 ergänzt dieses Beispiel. Es wird eine Seite hinzugefügt, die im Code aufbereitet wird und Informationen über den aktuellen HTTP-Request liefert. Es wird gezeigt, wie eine eine Web-Site als Ableitung von UrsAsyncWebSite erstellt werden kann. Der ESP8266 mit seinem für Mikroprozessoren riesiges Flash und RAM erlaubt es auch große Projekte umzusetzen. Kapselung ist hier dann eine wichtige Möglichkeit, den Überblick zu behalten. Das Verpacken der einzelnen Seiten erlaubt es, einen "Baukasten" von Web-Sites zu erstellen.
Das Beispiel 3 baut auf den vorher erstellten Code auf. Zum einen wird gezeigt, wie ein SPIFFS-Editor/Explorer über die vorgefertigte Seite UrsAsyncSpiffsEditorClass eingebunden werden kann. Zum anderen wird gezeigt, wie zum Platzhalter-Ersatz in den Seiten ein Template-Prozessor eingebunden werden kann.
Das Beispiel 4 behebt das Problem nicht konsistenter Web-Site-Inhalte durch Verwendung eines internen Speicherobjekts.
Im letzten Beispiel 5 wird dargestellt, wie eine Außensteuerung über eine Web-Site mit Hilfe der vorgefertigten Klasse UrsAsyncConfigEditorClass erstellt werden kann.
Das ZIP-Archiv für Bibliothek UrsAsyncWebServer zum Download. Die entpackten Dateien ins Verzeichnis <user>\Documents\Arduino\libraries kopieren (siehe Installing Additional Arduino Libraries).
Das Archiv enthält die Bibliotheksdateien
Hinweise:
Beim Auskoppeln der Beispiele aus der Library wird ggf. der Order "data" mit dem SPIFFS-Inhalt nicht mit kopiert. Das muss dann manuell nachgeholt werden.
Die WLAN-Zugangsdaten in "data/config.txt" zuerst bearbeiten. Dann "data" ins SPIFFS hochladen. Als nächstes die Zugangsdaten im Code anpassen. Erst dann das Programm übersetzen und hochladen.