HTTP Eingabeformular mit 2 Parametern

Hallo zusammen,

ich habe mal wieder ein Projekt, wo ich mit dem ESP arbeiten möchte. Dazu brauche ich natürlich eine Netzwerk verbindung, da WLAN an Bord ist, will ich das nutzen.

Momentan arbeite ich daran, dass er erkennt, dass kein bekanntes WLAN da ist und ein AP Modus eingerichtet wird. In dem kann man sich verbinden und man soll über eine Website SSID und PAsswort eingeben können.

Es hat shon lange gedauert, diese GET Funktion zu finden, aber das geht mittlerweile.

Allerdings in dem Beispielsketch habe ich nur die Möglichkeit einen Parameter nach dem anderen einzugeben.

hier für interessierte, die über das Problem stolpern, der Beispielsketch(auf einen D1mini getestet):

/*********
  Rui Santos
  Complete project details at https://RandomNerdTutorials.com/esp32-esp8266-input-data-html-form/
  
  Permission is hereby granted, free of charge, to any person obtaining a copy
  of this software and associated documentation files.
  
  The above copyright notice and this permission notice shall be included in all
  copies or substantial portions of the Software.
*********/

#include <Arduino.h>
#ifdef ESP32
  #include <WiFi.h>
  #include <AsyncTCP.h>
#else
  #include <ESP8266WiFi.h>
  #include <ESPAsyncTCP.h>
#endif
#include <ESPAsyncWebServer.h>

AsyncWebServer server(80);

// REPLACE WITH YOUR NETWORK CREDENTIALS
const char* ssid = "meineSSID";
const char* password = "meinPasswort";

const char* PARAM_INPUT_1 = "input1";
const char* PARAM_INPUT_2 = "input2";
const char* PARAM_INPUT_3 = "input3";

// HTML web page to handle 3 input fields (input1, input2, input3)
const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html><head>
  <title>ESP Input Form</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  </head><body>
  <form action="/get">
    input1: <input type="text" name="input1">
    <input type="submit" value="Submit">
  </form><br>
  <form action="/get">
    input2: <input type="text" name="input2">
    <input type="submit" value="Submit">
  </form><br>
  <form action="/get">
    input3: <input type="text" name="input3">
    <input type="submit" value="Submit">
  </form>
</body></html>)rawliteral";

void notFound(AsyncWebServerRequest *request) {
  request->send(404, "text/plain", "Not found");
}

void setup() {
  Serial.begin(115200);
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  if (WiFi.waitForConnectResult() != WL_CONNECTED) {
    Serial.println("WiFi Failed!");
    return;
  }
  Serial.println();
  Serial.print("IP Address: ");
  Serial.println(WiFi.localIP());

  // Send web page with input fields to client
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/html", index_html);
  });

  // Send a GET request to <ESP_IP>/get?input1=<inputMessage>
  server.on("/get", HTTP_GET, [] (AsyncWebServerRequest *request) {
    String inputMessage;
    String inputParam;
    // GET input1 value on <ESP_IP>/get?input1=<inputMessage>
    if (request->hasParam(PARAM_INPUT_1)) {
      inputMessage = request->getParam(PARAM_INPUT_1)->value();
      inputParam = PARAM_INPUT_1;
    }
    // GET input2 value on <ESP_IP>/get?input2=<inputMessage>
    else if (request->hasParam(PARAM_INPUT_2)) {
      inputMessage = request->getParam(PARAM_INPUT_2)->value();
      inputParam = PARAM_INPUT_2;
    }
    // GET input3 value on <ESP_IP>/get?input3=<inputMessage>
    else if (request->hasParam(PARAM_INPUT_3)) {
      inputMessage = request->getParam(PARAM_INPUT_3)->value();
      inputParam = PARAM_INPUT_3;
    }
    else {
      inputMessage = "No message sent";
      inputParam = "none";
    }
    Serial.println(inputMessage);
    request->send(200, "text/html", "HTTP GET request sent to your ESP on input field (" 
                                     + inputParam + ") with value: " + inputMessage +
                                     "<br><a href=\"/\">Return to Home Page</a>");
  });
  server.onNotFound(notFound);
  server.begin();
}

void loop() {
  
}

Das habe ich jetzt soweit angepasst, dass es schonmal 2 Parameter und einen Submit Button hat:
grafik

Der Coda dazu ist so verändert:

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html><head>
  <title>WiFi Input Form</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  </head><body>
  <form action="/get">
  SSID: <input type="text" name="SSID">
    Passwort: <input type="text" name="Passwort">
    <input type="submit" value="Submit">
</body></html>)rawliteral";

Beim Aufrufen von Submit wird folgende Adresse erzeugt:

(http://IPADRESSE/get?SSID=a&Passwort=b)

Das sieht auch gut aus.

Jetzt mus der ESP das nurnoch richtig interpretieren und da scheitert es.
Die Originalinterpretation sieht ja so aus:

// GET input1 value on <ESP_IP>/get?input1=<inputMessage>
    if (request->hasParam(PARAM_INPUT_1)) {
      inputMessage = request->getParam(PARAM_INPUT_1)->value();
      inputParam = PARAM_INPUT_1;
    }
    // GET input2 value on <ESP_IP>/get?input2=<inputMessage>
    else if (request->hasParam(PARAM_INPUT_2)) {
      inputMessage = request->getParam(PARAM_INPUT_2)->value();
      inputParam = PARAM_INPUT_2;
    }

Ich habe es dann umgebaut:

if (request->hasParam(PARAM_SSID) && hasParam(PARAM_Passwort)) {

Darauf kommt beim kompilieren der Fehler:

Compilation error: 'hasParam' was not declared in this scope

also nochmal umgebaut:

if (request->hasParam(PARAM_SSID) && request->hasParam(PARAM_Passwort)) {

Allerdings führt er immer nur den letzten aus.

Wie kann ich das kombinieren?

Geraten, weil ich deinen Code nicht sehe:
entferne das else.

Wenn dir das nicht weiterhilft:
Poste einen vollständigen Code (!) mit deinen Änderungen.

ok, es funktioniert jetzt, habe aber an sich nichts geändert...
Das führt also doch zum ziel:

if (request->hasParam(PARAM_SSID) && request->hasParam(PARAM_Passwort))

Das bezieht sich auf eine unbekannte Funktion, die du nach dem && anstelle der Methode
request->hasParam
versuchst zu verwenden.

Oh doch :slight_smile:

Hallo,
da würde ich noch mal drüber nachdenken. Was passiert wenn Dein Router für eine gewisse Zeit ausfällt. Wie viele bekannte W-Lan Netze hast du denn, worauf er ausweichen könnte. Eventuell landest Du ungewollt in dem AP Modus und wartest auf eine Eingabe, dabei wäre es sinnvoller einfach wieder zu verbinden. Ich denke ein Taster der bewusst gedrückt wird und dazu führt das der AP Modus eingeschaltet wird ist da sinnvoller.

Ok, das waren wertvolle Tips!

Also gedacht ist es so, dass er nur beim start schaut, welches WLAN da ist. wenn das eine bekannte da ist, wird damit verbunden und fertig, dann wird es keinen AP Modus geben. Falls man also aus dem WLAN bereich raus geht, muss man neu starten (reicht für diese Anwendung)

Wenn man also in ein anderes WLAN möchte, dann muss man auch neu starten und es startet der AP modus, nachdem das bekannte nicht gefunden wurde. Dann kann man wieder über Browser die Daten des neuen WLANs eingeben und die alten Daten werden gelöscht.

Ich fürchte bei meinem aktuellen Umgang, wird immer geprüft und wenn 12 sekunden keine Verbindung zum WLAN ist, dann wird der AP modus aktiviert, das bedeutet, dass man sich wieder verbinden muss oder neustart...

Vielen Dank für den Denkanstoß!

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.