lasselukkari / aWOT

Arduino web server library.
MIT License
283 stars 41 forks source link

Can't get setting value from web #142

Closed ATPESP32 closed 1 year ago

ATPESP32 commented 1 year ago

I can't set the parameters to change on the web from your library, can you show me, thank you very much.

if defined(ESP8266)

include

else

include

include

endif

include

define WIFI_SSID ""

define WIFI_PASSWORD ""

WiFiServer server(80); Application app;

char contentType[100] {}; bool shouldRestart = false;

void index(Request &req, Response &res) { res.set("Content-Type", "text/html");

res.println(""); res.println(""); res.println("

"); res.println(""); res.println(""); res.println("
"); res.println(""); res.println(""); res.println(""); }

void updateup(Request &req, Response &res) { char * type = req.get("Content-Type"); Serial.println(type); // this part, What do i have to do to get the value from web, thank you very much .

}

void setup() { Serial.begin(115200);

WiFi.begin(WIFI_SSID, WIFI_PASSWORD); while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print("."); } Serial.println(WiFi.localIP());

app.header("Content-Type", contentType, 100); app.get("/", &index); app.post("/update", &updateup); server.begin(); }

void loop() { WiFiClient client = server.available();

if (client.connected()) { app.process(&client); client.stop(); } }

image
lasselukkari commented 1 year ago

You are sending the data as JSON. You can parse the request (Stream) with ArduinoJson. I can write you an example during the weekend.

ATPESP32 commented 1 year ago

thanh you, that example can help me a lot.

lasselukkari commented 1 year ago
#if defined(ESP8266)
#include <ESP8266WiFi.h>
#else
#include <WiFi.h>
#endif
#include <aWOT.h>
#include <ArduinoJson.h> // install ArduinoJson with the library manager

#define WIFI_SSID ""
#define WIFI_PASSWORD ""

WiFiServer server(80);
Application app;

void index(Request &req, Response &res) {
  res.set("Content-Type", "text/html");

  res.print(
    "<html>\r\n"
    "<head>\r\n"
    "  <title>JSON Form Example</title>\r\n"
    "</head>\r\n"
    "<body>\r\n"
    "  <form id='form'>\r\n"
    "    <input type='text' id='ssid' />\r\n"
    "    <input type='password' id='password' />\r\n"
    "    <input type='submit' value='Submit' />\r\n"
    "  </form>\r\n"
    "</body>\r\n"
    "<script>\r\n"
    "  document.getElementById('form').addEventListener('submit', (event) => {\r\n"
    "    event.preventDefault();\r\n"
    "    fetch('/api/wifi', {\r\n"
    "      method: 'POST',\r\n"
    "      headers: {\r\n"
    "        'Content-Type': 'application/json'\r\n"
    "      },\r\n"
    "      body: JSON.stringify({\r\n"
    "        ssid: document.getElementById('ssid').value,\r\n"
    "        password: document.getElementById('password').value\r\n"
    "      })\r\n"
    "    });\r\n"
    "  });\r\n"
    "</script>\r\n"
    "</html>\r\n"
  );
}

void form(Request &req, Response &res) {
  DynamicJsonDocument formData(2048);
  if (!deserializeJson(formData, req)) {
    return res.sendStatus(400);
  }

  const char* ssid = formData["ssid"];
  const char* password = formData["password"];
  Serial.print("SSID: ");
  Serial.println(ssid);
  Serial.print("Password: ");
  Serial.println(password);

  res.sendStatus(204);
}

void setup() {
  Serial.begin(115200);

  WiFi.begin(WIFI_SSID, WIFI_PASSWORD);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println(WiFi.localIP());

  app.get("/", &index);
  app.post("/api/wifi", &form);
  server.begin();
}

void loop() {
  WiFiClient client = server.available();

  if (client.connected()) {
    app.process(&client);
    client.stop();
  }
}

And here is the unescaped HTML

<html>

<head>
  <title>JSON Form Example</title>
</head>

<body>
  <form id='form'>
    <input type='text' id='ssid' />
    <input type='password' id='password' />
    <input type='submit' value='Submit' />
  </form>
</body>
<script>
  document.getElementById('form').addEventListener('submit', (event) => {
    event.preventDefault();
    fetch('/api/wifi', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        ssid: document.getElementById('ssid').value,
        password: document.getElementById('password').value
      })
    });
  });
</script>

</html>
lasselukkari commented 1 year ago

Did this solve your problem? Can I close the issue?