Rolladensteuerung per ESP8288 + WiFi?

hallo,
hat schon mal wer eine Rolladensteuerung per ESP8288 + WiFi verwirklicht?
Motoren über eine Website an/aus bzw. auf/ab schalten klappt schon, was mir fehlt ist ein passender Einbau-Funkschalter, der wie ein nodeMCU slave funktioniert und auch via Website kontrolliert werden kann.

Der Webserver ist ein nodeMCU.
Zur Zeit habe ich 3 Motor-Rollos mit Wand-Schalttaster und teilw. mit programmierbaren Schaltzeiten, aber davon sind 2 jetzt inzwischen defekt, sodass nur die manuelle Steuerung halbwegs funktioniert (Schaltwippe mit 1 Tastkontakt oben und 1 unten, allerdings Wackelkontakt); in Endstellung wird automatisch abgeschaltet.
Das würde ich jetzt gern über einen handelsüblichen WiFi-Einbau-Schalter ersetzen, denn 230V Basteleien mit nodeMCUs sind mir etwas heikel:
hat jemand Erfahrung mit so etwas und keennt das eine oder andere Produkt ?

mich würde interessieren wie Du das ansteuern der motoren über die webseite machst... geht das z.b. auch mit esp32?

Zitat:

---

Zitat von inka

mich würde interessieren wie Du das ansteuern der motoren über die webseite machst... geht das z.b. auch mit esp32?

---

hallo,
habe das jetzt nicht mehr weiter verfolgt, weil mir andere Dinge wichtiger waren -
inzwischen ist es mir aberr auch selber viel klarer geworden:
und, klar, geht sowohl mit esp32 als auch esp8266, s.z.B. wie hier - nur eben dann nicht LEDs, sondern per Relais etc:

https://lastminuteengineers.com/crea...r-arduino-ide/

Nur meine vorhandenen (handelsüblichen) Rolladensteuerungen sind nach wie vor nicht so leicht für Relaisbasteleien zugänglich, was ihre internen Schaltkontakte angeht.

Zitat:

---

mich würde interessieren wie Du das ansteuern der motoren über die webseite machst

---

um auf diesen Part zu antworten, mit micropython und flask/bottle (gibt diverse varianten dieses php ähnlichen python-web-servers) kannst du sowas ziemlich simple aufbauen

einfach eine html schreiben, mit ein wenig javascript und einem socket kannst du dann den datenaustausch realisieren oder dein python code inline in das html einbetten wie in php und die sachen per request ausführen bzw. on the fly in das dokument printen um ausgaben zu machen

vielen dank für die hilfe...

@HAWE - excellent erklärt auf der webseite :-)

@Ceos - netter versuch, aber wer Dein lösungsvorschlag versteht, der hätte vermutlich nicht meine frage gestellt :-(

Zitat:

---

@Ceos - netter versuch, aber wer Dein lösungsvorschlag versteht, der hätte vermutlich nicht meine frage gestellt :-(

---

okay, hatte jetzt GRundkenntnisse in PHP und dessen Funktionsweise vorausgesetzt

aber einfach asugedrückt, damit kann man genauso wie mit Arduino eine Art Webserver auf dem Controller aufsetzen, aber während der HTML Code übertragen wird, wird auch der PHP/Python Code vom Webserver selbst ausgeführt der in der Datei steht
und der ist so geschrieben, dass er wiederum das HTML Dokument in dem er steht an den passenden Stellen um Informationen ergänzt

Wenn du jetzt noch JavaScript einbettest (welches auf deinem Browser läuft) kannst du sogar einen live feed von Steuerinformationen zwischen der Webseite als GUI und deinem ESP controller aufbauen die parallel über eine Socket läuft

Zitat:

---

Zitat von Ceos

okay, hatte jetzt GRundkenntnisse in PHP und dessen Funktionsweise vorausgesetzt

aber einfach asugedrückt, damit kann man genauso wie mit Arduino eine Art Webserver auf dem Controller aufsetzen, aber während der HTML Code übertragen wird, wird auch der PHP/Python Code vom Webserver selbst ausgeführt der in der Datei steht
und der ist so geschrieben, dass er wiederum das HTML Dokument in dem er steht an den passenden Stellen um Informationen ergänzt

Wenn du jetzt noch JavaScript einbettest (welches auf deinem Browser läuft) kannst du sogar einen live feed von Steuerinformationen zwischen der Webseite als GUI und deinem ESP controller aufbauen die parallel über eine Socket läuft

---

ich denke, wenn sich jemand noch gar nicht mit webserver oder wifiserver und ~clients auskennt, wie die Inkas Frage vemuten lässt, würde hier nur ein wirklich benutzbares Codebesispiel helfen (welcher html code, welcher php Code, welcher Python Code, welcher Javasript Code, was für ein flask, was für ein bottle, was für ein Socket - und was ist das überhaupt?)
- ich selber verstehe von dem, was du geschrieben hast, zugegebenermaßen auch KEIN Wort ;)

wie gesagt, ohne Verständnis wie PHP funktioniert müsste ich etwas weiter ausholen, aber im Grunde ist das Konstrukt simple:

du hast eine etwas unvollständige HTML Seite, quasi einen Rumpf zum Darstellen der GPIOs als Beispiel.

wenn du die Webseite aufrufst wird dann der HTML Code ausgegeben wie bei einem stumpfen HTML-Webserver

aber du könntest bei PHP halt PHP-Script und bei Flask halt Python-Code einfach in deinem HTML Code einbetten

dieser wird beim Öffnen der Webseite auf der Seite des Servers aufgerufen, hat also Zugriff auf GPIO und ruft dessen Zustand ab

und gibt dann über die print-Funktion zum Beispiel den passenden HTML Code aus, der an diese Stelle gehört damit man 8 grün eLämpche für die GPIO Pins bekommt

Wenn du jetzt noch vermeiden willst die Seite immer neu zu laden zum Aktualisieren, musst du auch Javascript benutzen und im Browser per Javascript direkte Socket Verbindung zusätzlich zur Webverbindung aufbauen über die kontinuierlich Daten ausgetauscht werden, welche dann in der Webseite im Browser per Javascript aktualisiert werden.

Aber das ist schon eher Königsklasse ohne fertige Frameworks oder passende Libs, trotzdem Reizvoll, wollte schonmal ein Browsergame basierend auf Flask machen das man per Handy und WLAN spielen kann und der Server ist sowass wie das Spielbrett

Zitat:

---

Zitat von Ceos

wie gesagt, ohne Verständnis wie PHP funktioniert müsste ich etwas weiter ausholen, aber im Grunde ist das Konstrukt simple:

du hast eine etwas unvollständige HTML Seite, quasi einen Rumpf zum Darstellen der GPIOs als Beispiel.

wenn du die Webseite aufrufst wird dann der HTML Code ausgegeben wie bei einem stumpfen HTML-Webserver

aber du könntest bei PHP halt PHP-Script und bei Flask halt Python-Code einfach in deinem HTML Code einbetten

dieser wird beim Öffnen der Webseite auf der Seite des Servers aufgerufen, hat also Zugriff auf GPIO und ruft dessen Zustand ab

und gibt dann über die print-Funktion zum Beispiel den passenden HTML Code aus, der an diese Stelle gehört damit man 8 grün eLämpche für die GPIO Pins bekommt

Wenn du jetzt noch vermeiden willst die Seite immer neu zu laden zum Aktualisieren, musst du auch Javascript benutzen und im Browser per Javascript direkte Socket Verbindung zusätzlich zur Webverbindung aufbauen über die kontinuierlich Daten ausgetauscht werden, welche dann in der Webseite im Browser per Javascript aktualisiert werden.

Aber das ist schon eher Königsklasse ohne fertige Frameworks oder passende Libs, trotzdem Reizvoll, wollte schonmal ein Browsergame basierend auf Flask machen das man per Handy und WLAN spielen kann und der Server ist sowass wie das Spielbrett

---

die Fragen, die sich MIR da aufdrängen, sind:
was ist ein "stumpfer HTML-Webserver"?
wie sieht ein "PHP-Script" aus?
wie sieht ein "Python-Code" aus, insb. "einfach in HTML Code eingebettet"?
was ist das genau mit "bei Flask halt Python-Code"?
was ist das mit dem "über die print-Funktion" und was ist ein "passender HTML Code ", damit "man 8 grüne Lämpche für die GPIO Pins bekommt " ?
wie genau geht "musst du auch Javascript benutzen",
wie geht "im Browser per Javascript direkte Socket Verbindung zusätzlich zur Webverbindung aufbauen"
wie geht das mit "dann in der Webseite im Browser per Javascript aktualisiert werden"
:?:

ich hoffe du verstehst, worauf ich hinaus will...
ohne fertigen, vollständigen Code für einen ESP32 (!) und weitergehende Anleitungen wird das keiner verstehen, der die Eingangsfrage

Zitat:

---

mich würde interessieren wie Du das ansteuern der motoren über die webseite machst... geht das z.b. auch mit esp32?

---

überhaupt gar nicht erst gestellt hätte ;)

Zitat:

---

ich hoffe du verstehst, worauf ich hinaus will...
ohne fertigen, vollständigen Code für einen ESP32 (!) und weitergehende Anleitungen wird das keiner verstehen, der die Eingangsfrage

---

Das einzige was ich aus deiner Antwort lese ist, das du dich nichtmal 5 Minuten mit Google hinsetzen willst um zu gucken wie ein Webserver funktioniert, wie PHP aussieht und wie es Grundlegend funktioniert Webseiten dynamisch zu gestalten. (Nein ich meine keine Animationen sondern aktualisieren mit externen Daten)

Wenn du dir wenigstens die Mühe machen würdest die Grundlagen selber zu erarbeiten würden sich dir die Zusammenhänge ergeben und bis auf 3 Fragen alles beantwortet.

Eine Webseite mit JS einen Socket öffnen zu lassen und dann das HTML Dokument mit den ausgetauschten Daten updaten sind schon 2 Dinge die eher als Königsdisziplin gelten
und das "print passenden HTML Code" musst du dir einfach wie Lückentext vorstellen, der statische HTML Code ist nur der Rumpf der Webseite und hat Lücken(zum Beispiel ein Platzhalter und Text für die GPIO Pins), die man mit den Ausgaben aus dem Python oder PHP auffüllt (zum Beispiel mit grünen Kreisen und dem Wort "Off" für Pins die Aus sind)

Zitat:

---

Zitat von Ceos

Das einzige was ich aus deiner Antwort lese ist, das du dich nichtmal 5 Minuten mit Google hinsetzen willst um zu gucken wie ein Webserver funktioniert, wie PHP aussieht und wie es Grundlegend funktioniert Webseiten dynamisch zu gestalten. (Nein ich meine keine Animationen sondern aktualisieren mit externen Daten)

Wenn du dir wenigstens die Mühe machen würdest die Grundlagen selber zu erarbeiten würden sich dir die Zusammenhänge ergeben und bis auf 3 Fragen alles beantwortet.

Eine Webseite mit JS einen Socket öffnen zu lassen und dann das HTML Dokument mit den ausgetauschten Daten updaten sind schon 2 Dinge die eher als Königsdisziplin gelten
und das "print passenden HTML Code" musst du dir einfach wie Lückentext vorstellen, der statische HTML Code ist nur der Rumpf der Webseite und hat Lücken(zum Beispiel ein Platzhalter und Text für die GPIO Pins), die man mit den Ausgaben aus dem Python oder PHP auffüllt (zum Beispiel mit grünen Kreisen und dem Wort "Off" für Pins die Aus sind)

---

wie genau ein webserver funktioniert, war doch eigentlich genau die Gretchenfrage, zugespitzt auf ESP32.

ich persönlich weiß noch nicht mal was ein Socket genau ist, geschweigedenn wie man ihn öffnet. ich kenne auch weder JS noch Python, und auch html kann ich nicht (weder stumpf noch spitz) - höchstens versuchen, fertigen Code zu verstehn wie in meinem Arduino-ESP-Link, aber selbst da sind 90% für mich reine "??????????????????".
Wie man ein print in C/++ schreibt weiß ich (printf() oder bei Arduino Serial.print()), aber was und wie ich wo bei deinem Code an welches print an welcher Codestelle hinschreiben müsste: absolut nicht. Du setzt viel zu viel voraus, und wenn du es erklären willst, dann verweise nicht einfach auf Google, sondern zeig es doch einfach, wie es genau geht!

Ich brech das ganze mal runter auf die Möglichkeiten und dem zugehörigen Aufwand:

- Apache: (Abseits dass man ein OS dafür braucht und sonst viel zu viel unnötige Funktionen drinne stecken aber als "stumpfer Webserver")
Man kann Webseiten mit HTML konstruieren und dann über entsprechend generierte Unterdokumente den Inhalt in gewissem Maße dynamisch updaten. dafür braucht man aber ein zusätzliches Programm, welches die Unterdokumente dynamisch erstellt und updatet.

- PHP: (Die Ursprungsversion der Idee und am weitesten verbreitet ... braucth auch ein OS)
Man kann Templates (Lückentexte) entwerfen und die Lücken über Variablen oder direkt eingebetteten Code füllen lassen. Das Resultat muss jedoch in die Dokumentstruktur passen!

- Flask/Bottle: (Die Python basierte PHP Lösung)
Ebenfalls basierend auf Templates, aber im Gegensatz zu PHP haben wir über Python viel tiefgreifenderen Zugriff auf die Hardware und im Fall von µPython bis zur Peripherie und können so ganz Schlank und top aktuell Daten generieren ... in PHP hätte ich wohl wieder ein Programm gebraucht dass entweder eine Daeti oder Datenbank oder eine Art der API zu PHP bereitstellt um die Informationen direkt im PHP bereit zu haben.

- Arduino Webserver:
Habe ich noch nie selber aktiv außer zum ausprobieren verwendet, aber was ich daraus gelernt habe, es ist kompliziert.
Man kann alle oben genannten Funktionen abbilden, aber vieles davon muss man immernoch zu Fuss schreiben.
Mir mag hier einiges an Wissen zu effizienten Funktionen fehlen aber wenn ich in den ersten Tutorials schon etwas lese dass ich die Anfrage selber zerlegen und die Antwort selber zusammenstricken muss hab cih auch keine Lust es auszuprobieren

Einfach mal als Vergleich

https://www.arduino.cc/en/Tutorial/WebServer

VS

https://www.tutorialspoint.com/flask...templates.html


Javascript ist wie gesagt Königsklasse und nicht wirklich relevant.
Alle Wege zu erklären und gebrauchsfertige Beispielcodes zu schreiben wäre Aufwand den ich mir bezahlen lassen müsste.
Für dich konkret gibt es nur den Arduino Weg und die Einstiegshürden erscheinen mir einfach zu hoch um mich selber dafür zu motivieren.
Ich persönlich favorisiere den Python Weg weil ich Python in dem Kontext einfach für die "intuitivere" Sprache halte und c/gcc viel zu viele Randbedingungen kennt um die ich mich kümmern muss.

dankeschön, ich zumindest sehe jetzt schon ein paar Unterschiede deutlich klarer.
https://www.tutorialspoint.com/flask...templates.html
ist aber leider 404 - not found!

https://www.tutorialspoint.com/flask..._templates.htm ... der ergänzt hinten immer ein kleines "L" wenn ich das in die Link Maske eingebe aber es ist ein htm ... blöde Autovervollständigung

Zitat:

---

Zitat von Ceos

https://www.tutorialspoint.com/flask..._templates.htm ... der ergänzt hinten immer ein kleines "L" wenn ich das in die Link Maske eingebe aber es ist ein htm ... blöde Autovervollständigung

---

kompletter esp32 Arduino code für so ein Hello Server:

Code:

---

// http://esp32-server.de/ 


#include <WiFi.h>
#include <WiFiClient.h>
#include <WebServer.h>


const char* ssid    = "***************";
const char* password = "********************";

const char indexHTML[] PROGMEM = R"=====(
<!DOCTYPE html>
<html>
 <head>
  <title>Erstes Programm</title>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name=viewport content="width=device-width, initial-scale=1">
 </head>
 <body>
            <h1 style="text-align: center;">Hallo ESP32</h1>
 </body>
</html>
)=====" ;

WebServer server(80);
IPAddress apIP(192, 168, 2, 1);

void setup()
{
  Serial.begin(115200);
  delay(1000);
 
  Serial.println("Warte auf Verbindung");
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  Serial.println("");

  while (WiFi.status() != WL_CONNECTED)
  {
    delay(500);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("IP Addresse: ");
  Serial.print("http://");Serial.println(WiFi.localIP());
  server.on("/", Ereignis_Index);
  server.onNotFound(handleNotFound);
  server.begin();
  Serial.println("HTTP Server gestartet");
}

void Ereignis_Index()    // Wird ausgeführt wenn "http://<ip address>/" aufgerufen wurde
{
  server.send(200, "text/html", indexHTML);      //dann Index Webseite senden
}

void handleNotFound()
{
  server.send(404, "text/plain", "File Not Found\n\n");
}

void loop(void)
{
  server.handleClient();
}

---

hallo,

mit diesem link

https://lastminuteengineers.com/crea...r-arduino-ide/

habe ich alles, was zu der beantwortung meiner ursprünglichen frage notwendig war, bekommen, nochmals danke HAWE.

Ich möchte weder htm/l, noch php oder python lernen und es aus dem "ff" beherrschen. Mein ziel ist - zugegebenermassen - ein oberflächliches verstehen eines funktionierenden arduino-codes (wie im beispiel von HAWE, mit erklärungen und kommentaren zu einzelnen sequenzen) mit dem ich experimentieren und noch etwas mehr lernen kann. Können wir das thema damit abschliessen?

es ging mir ja auch zugegebenermaßen um meine allererste Frage, worauf man so eine Steuerung am einfachsten/besten aufsetzt.
ESP/Arduino war mir das naheliegendste und andere Software-Plattformen fand ich eher verwirrend als hilfreich. Allerdings habe ich jetzt immer noch den Eindruck, dass es mit dem Arduino-html-webserver nicht wirklich (schon gar nicht viel) komplizierter ist als mit JS, php, oder python/Flask/bottle.
Ein bisschen html braucht man allerdings schon immer, um Schrift, Messwerte, Grafen und Steuerbuttons etc. halbwegs vernünftig einzubinden.

mir persönlich erschien die ganzen Ein-und Ausgaben bzw. File-Handles selber zu verwalten um die Aufrufe abzuarbeiten als zu lästig dass ich mich dann eben für µPython entschieden habe

@HaWe dein Beispiel zeigt ziemlich genau was ich meine

das Hauptprogramm besteht wie in der gelinkten Webseite nur aus einer Zuordnung von Handles zu Aufruf-Adressen und jeder Aufruf löst halt eine methode aus.

Aber das entscheidende ist, dass man sich die Templates selber mit Textmarkern bauen muss um dann entsprechend Variablen übergeben zu können oder täusche ich mich da?

also in Python gibt es die
render_template("templatefile.txt", var1 = val1, var2 = val2, ...)

bei der man quasi nur befiehlt das Template zu laden, enthaltenen Code auszuführen und das Ergebnis zurück zu geben. So hat man maximale Trennung von individueller Webseite und Kern Server, wie bei PHP eben

aber bei Arduino müsste ich mir selber die html bauen, parsen und entweder über Marker oder eben JS die WEbseite anschließend mit Daten füllen

ja, vermutlich schon, aber wenn ich 1 Code mit 2 Buttons habe (wie bei dem 2-LED-Beispiel) und jetzt noch 2 weitere brauche, dann kopiere ich den Part einfach noch mal dazu und passe die Variablen zum Schalten entsprechend an.
Auch sonst verwende ich in meinem Programm ja Arduinisch, und das meiste geht um Sensordaten-Verarbeitung und Schaltvorgänge, die html-Website ist ja nur die Visualisierung als Interface.

Zusätzliche Schalter kriegen eben einfach eine neuen Pfad wie "/led3ON" oder "/led3OFF" oder "/client1/led1ON" und "/client1/led1OFF" bzw. "/client2/led1ON" und "/client2/led1OFF" etc., die einfach per c+p eingefügt werden.
Variablen lege ich meist global an und füge die entsprechenden html-Zeilen mit ihren Namen für ihre Anzeige ebenfalls per c+p ein.

Immerhin habe ich aber so alles in 1 Code, und ich muss jetzt nicht auch noch extern an irgendwelchen anderen Programmen, Tools und Schnittstellen herumbasteln.

Zitat:

---

Immerhin habe ich aber so alles in 1 Code, und ich muss jetzt nicht auch noch extern an irgendwelchen anderen Programmen, Tools und Schnittstellen herumbasteln.

---

das ist mal wieder unsachlich und unfair (vermutlich ungewollt) formuliert!

es gibt bei deiner Kombination genau so viel Aufwand wie bei meiner

Arduino + HTML + Strings zusammenknoten

Python + HTML + Templates schreiben

da gibts keinerlei Mehraufwand das ist falsch! Eher sogar weniger Aufwand!


für meinen persönlichen Geschmack liegt die Eleganz der Python-Lösung in der Schlankheit der Implementierung ... aber µPython ist halt schon ein "Brummer" im Flash :D

Ich möchte hier auch nicht ausschließen dass es eine TEmplates Lösung für Arduino gibt, aber ich zweifle daran und die Doku gibt auch nichts her, aber vielleicht gibt es eine Library die man draufsetzen kann die einem Templates vorhält


PS: lol ... einmal google und siehe da ... explizit für den ESP32 und unter Verwendung des ESP eigenen AsyncWebServer gibt es das Templateverfahren (in extrem vereinfachter Form)

https://techtutorialsx.com/2018/10/0...m-file-system/

Aber das reicht nur für Variablen, der Code muss immernoch im .INO stehen, sonst kann es ja nicht compiliert werden :D

Ich denke meiner Ausbildung und Erfahrung wegen halt stark in Struktuierten Programmen und da ist sowas wie der Flask einfach nur himmlisch! Der "Serv(ier)er" nimmt die Bestellung entgegen und leitet die Anfrage an den entsprechenden "Koch" der dann das Essen zubereitet, welches der "Serv(ier)er" dann ausliefert.

Und der Koch ist in dem Sinnbild halt das Template ... gefällt mir der Koch oder SErvierer nicht, kann cih sie aunabhängig voneinander umschreiben ... besser noch ich könnte mit einem Servierer und 3 Köchen fast unbemerkt einen der Köche austauschen ohne das Projekt neu zu compilen, ich müsste eeinfach nur das Template updaten, noch während der Server läuft

Für mich und meine Wahrnehmung ist das sehr Elegant ... auch wenn ich dafür ein Restaurant mit fast mehr Küchenfläche als Gastraum mieten muss (um den Flash Verbrauch von µPython mal ins Bild zu setzen)

aber ich kann doch gar kein Python (und ich mag kein Python, auch nicht auf dem Raspi), auch meine ganzen MCUs können weitgehend kein Python, und für alle Programme und Funktionen nutze ich ja eh nur die Arduino IDE, für alle MCUs (AVR, ARM M0, M3, M4, ESP8266, ESP32).
ESPs nutzten dieselben Libs wie meine AVR-oder ARM-Programme, die alle ein touch TFT oder auch nur ein OLED für die Anzeige nutzen, nur dass jetzt die ESPs zusätzlich html webserver und wifiserver/client Code verwenden.
Würde ich jetzt die Websites und die Kommunikation untereinander anders aufbauen, bräuchte ich ja jetzt weiterhin mein Arduino für die eigentlichen Programmfunktionen (davon würde ich nie weggehen), aber dann jetzt auch noch zusätzlich Python für die web- und wifi-Funktionen, wo ich gar nicht weiß, wie ich das alles nahtlos zusammenkriege.

- - - Aktualisiert - - -

PS
das mit dem SPIFFS habe ich schon mal irgendwo als ESP32-Beispiel gesehen, aber ich muss gestehen, dass ich das überhaupt nicht verstehe, was das soll - für mich ist das sehr komplex und unübersichtlich...

SPIFFS https://tttapa.github.io/ESP8266/Cha...%20SPIFFS.html

Das ist eine sehr interessante (ich möchts glatt so nennen) "Abhandlung" zum Thema

Im Grunde ist es ein simuliertes Dateisystem (in dem Falle halt in einem SPI-Flash)

Auf dem PC kannst du ja nach belieben file= open("filename","modus") angeben um eine Datei zu öffnen

Auf dem Arduino fehlt erstmal Grundsätzlich ein Massenspeicher! Wenn du z.B. eine SDCard anschließt und dann die passende Library nutzt, bietet in der Regel das SDCard Objekt eine open Funktion an um auf Daten darin zuzugreifen. Aber je nach Flashgröße deines Boards oder Controllers (im Fall von STM32 Boards liegt das SPIFFS tatsächlich im Flash des Controller, es ist also streng genommen kein "SPI"-FFS mehr) liegt hier das Dateisystem im Flash auf dem Board selber (meine Erfahrung mit dem SPIFFS Implementierungen für STM32 Controller und µPython hat gezeigt dass man mindestens 25k freien Flash Speicher braucht um ein minimales SPIFFS aufzusetzen .. hat ein Contributor zum µPython Projekt herausgefunden nachdem ich lang genug herumgebohrt habe mit den Parametern)

das mit dem SPIFFS macht das ganze für mich dennoch eher komplizierter und unübersichtlicher als einfacher.
Ich kann besser mit ein paar untereinandergeschriebenen Wiederholungen für Variablen- und Buttonanzeige umgehen als mit kompliziert verschachtelten Funktionen mit -zig Parametern.

Einfacher wäre es tatsächlich, wenn ich schreiben könnte statt

Code:

---

float Temperaturestat=-999, Humiditystat=-999;
uint8_t led1stat=0, led2stat=0;

//----------------------------------------------------------
String SendHTML(){
 
  String script = "<!DOCTYPE html> <html>\n";
 
  script +="<head>";
  script +="<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"> \n" ;
  script +="<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n"; 
  script +="<title>LED Control</title>\n";
  script +="<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}\n";
  script +="body{margin-top: 50px;} h1 {color: #444444;margin: 50px auto 30px;} h3 {color: #444444;margin-bottom: 50px;}\n";
  script +=".button {display: block;width: 80px;background-color: #3498db;border: none;color: white;padding: 13px 30px;text-decoration: none;font-size: 25px;margin: 0px auto 35px;cursor: pointer;border-radius: 4px;}\n";
  script +=".button-on {background-color: #3498db;}\n";
  script +=".button-on:active {background-color: #2980b9;}\n";
  script +=".button-off {background-color: #34495e;}\n";
  script +=".button-off:active {background-color: #2c3e50;}\n";
  script +="p {font-size: 20px;color: #888;margin-bottom: 10px;}\n";  // 14px;
  script +="</style>\n";
  script +="</head>\n";
 
  script +="<body>\n";
  script +="<h1>ESP32 Web Server</h1>\n";
  //  script +="<h3>Using Station(STA) Mode</h3>\n";
 
  if(led1stat)
  {script +="<p>LED1 Status: ON</p><a class=\"button button-off\" href=\"/led1off\">OFF</a>\n";}
    else
  {script +="<p>LED1 Status: OFF</p><a class=\"button button-on\" href=\"/led1on\">ON</a>\n";}

  if(led2stat)
  {script +="<p>LED2 Status: ON</p><a class=\"button button-off\" href=\"/led2off\">OFF</a>\n";}
    else
  {script +="<p>LED2 Status: OFF</p><a class=\"button button-on\" href=\"/led2on\">ON</a>\n";}

  script +="<h1>ESP32 Weather Report</h1>\n";
 
  script +="<h1>";
  script +="<p>Temperature: ";
  script +=(int)Temperaturestat;
  script +="°C</p>";
  script +="<p>Humidity: ";
  script +=(int)Humiditystat;
  script +="%</p>";
  script +="</h1>";

  script +="</body>\n";
  script +="</html>\n";
  return script;
}

---

jetzt, vereinfacht:

Code:

---

float Temperaturestat=-999, Humiditystat=-999;
uint8_t led1stat=0, led2stat=0;

//----------------------------------------------------------
String SendHTML(){
 
  String script = startHtmlWebsite();

  script += defineFonts();
  script += defineColors();
  script += importWidgets();

  script += printTitle(h1, "ESP32 Web Server" );
 
  script += printText(h3, "Using Station(STA) Mode \n");
  script += addButton("LED1 Status: %s \n",  led1stat);
  script += addButton("LED2 Status: %s \n",  led2stat);

  script += printText(h1, "ESP32 Weather Report \n");

  script += printVar(h2, "Temperature: %d° \n ", (int)Temperaturestat );
  script += printVar(h2, "Humidity: %d%% \n ", (int)Humiditystat );
 
  script += finishHtmlWebsite();

  return script;
}

---

Die Idee ist nicht schlecht, aber dein RAM wird sthönen und der Aufruf einer Webseite sehr lange dauern, weil du be jedem Aufruf erst den String im RAM konstruierst und zurück gibst.

Ich grübel gerade ob man den statischen Teil nicht irgendwie sinnvoll außerhalb der Methoden als Const hinterlegen kann und dann einfach nur beim schreiben in den Socket bestimmte Marker abwartet um dann eben Inhalte einzufüllen (wie in dem ESP spezifischen AsyncWebServer Beispiel oben)

So etwas in der Art wie "<?varName1?>"

Variablen übergibst du am besten mit Hilfe eines Dictionary, also eine Liste von <Key, Value> Paaren

Code:

---


typedef VarList_t std::Map<std::String, std::String>;
boolean sendHTML(std::String Template, VarList_t aVarList);

VarList_t  VarList;
...
VarList.clear();
VarList["varName1"] = "etwas schönes"
if(!sendHTML(irgendeineHTMLmitVarName1darin,VarList) printError();

---

Wenn jetzt in SendHTML während des senden in dem HTML String ein "<?" gefunden wird, sendet er nciht weiter sondern scannt bis zum passenden "?>" durch. Dann ruft er den Inhalt der Variable aus dem Dictionary und sendet den Inhalt. Danach setzt er nach dem schließenden "?>" den HTML String weiter fort, bis er wieder auf "<?" stößt oder am Ende ankommt.

Zitat:

---

Zitat von Ceos

Die Idee ist nicht schlecht, aber dein RAM wird sthönen und der Aufruf einer Webseite sehr lange dauern, weil du be jedem Aufruf erst den String im RAM konstruierst und zurück gibst.

Ich grübel gerade ob man den statischen Teil nicht irgendwie sinnvoll außerhalb der Methoden als Const hinterlegen kann und dann einfach nur beim schreiben in den Socket bestimmte Marker abwartet um dann eben Inhalte einzufüllen (wie in dem ESP spezifischen AsyncWebServer Beispiel oben)

So etwas in der Art wie "<?varName1?>"

Variablen übergibst du am besten mit Hilfe eines Dictionary, also eine Liste von <Key, Value> Paaren

Code:

---


typedef VarList_t std::Map<std::String, std::String>;
boolean sendHTML(std::String Template, VarList_t aVarList);

VarList_t  VarList;
...
VarList.clear();
VarList["varName1"] = "etwas schönes"
if(!sendHTML(irgendeineHTMLmitVarName1darin,VarList) printError();

---

Wenn jetzt in SendHTML während des senden in dem HTML String ein "<?" gefunden wird, sendet er nciht weiter sondern scannt bis zum passenden "?>" durch. Dann ruft er den Inhalt der Variable aus dem Dictionary und sendet den Inhalt. Danach setzt er nach dem schließenden "?>" den HTML String weiter fort, bis er wieder auf "<?" stößt oder am Ende ankommt.

---

RAM habe ich doch bis zum Abwinken bei den ESPs, sogar beim 8266, darüber mache ich mir keine Sorgen.
Beim ESP32 habe ich sogar ungenutzte 160MB im Heap...
wichtig wäre nur eine einfache Syntax, die nach Variablenübergabe (z.B. wie bei sprintf) alles drum und dran intelligent mit html Zeichen und Tokens ergänzt.

ich lese hier nur 520KB RAM insgesamt für den ESP32 , ich vermute MB war vertippt

Mit "Sorgen machen" hat das nicht viel zu tun ... morgen schreibst du etwas auf der Basis deines jetzigen Codes und wunderst dich am Ende des Tages warum dein Projekt ständig rebootet

Die Art und Weise solche statischen Daten als lokale Variablen in Methoden zu deklarieren ist so schlecht das sollte man vermeiden wo es nur geht!

Zitat:

---

Zitat von Ceos

ich lese hier nur 520KB RAM insgesamt für den ESP32 , ich vermute MB war vertippt

Mit "Sorgen machen" hat das nicht viel zu tun ... morgen schreibst du etwas auf der Basis deines jetzigen Codes und wunderst dich am Ende des Tages warum dein Projekt ständig rebootet

Die Art und Weise solche statischen Daten als lokale Variablen in Methoden zu deklarieren ist so schlecht das sollte man vermeiden wo es nur geht!

---

uups sorry, kB ntl

520kB stimmen nicht für den praktischen Gebrauch, es sind "nur" 160kB statisches und 160kB dynamisches RAM

schlecht und unbedingt zu vermeiden ist aber erstmal gar nichts, solange es funktioniert und nach C++ Regelwerk korrekt ist
- hingegen Flash zum Speichern von Variablen versuche ich zu vermeiden aus Performance- und Schonungsgründen ;)

Und wenn man es macht wie in den original ESP Arduino Examples mit script +=... braucht es letzlich ja auch nicht weniger Speicher
- in Funktionen ausgelagert eher sogar deutlich weniger, weil man es für Wiederholungen/Mehrfachgebrauch ja nur 1x schreiben muss (zum Generieren von 10 Buttons bräuchte man nur 1x die Button-Generier-Funktion).