POST with fetch to ESPAsyncWebServer generates empty chunks #1443

fabriziop · 2024-10-26T15:21:25Z

I'm using the ESP Async WebServer to receive POST Json data by a web page submission from a IOT (NodeMCU ESP8266).

In this case, the callback receiving the POSTed data is fired twice. The server generates chunks of data 154 bytes long, at max. Since the whole data is 174 bytes long, there is a first chunk 154 bytes long and a second chunk 20 bytes long.

At the first chunk, all is going as expected, while the second chunk appears empty and the last part of data is lost.

The printout of the code below shows the data loss.

json body len,index,total = 154, 0, 174  <--- chunk #1 is OK
START looping on jdoc objects
key:A  value:11111111
key:B  value:22222222
key:C  value:33333333
key:D  value:44444444
key:E  value:5555555
key:F  value:66666666
key:G  value:7777777
key:H  value:8888888
key:I  value:9999999
key:J  value:10
key:K  value:11
key:L  value:12
END looping on jdoc objects

json body len,index,total = 20, 154, 174 <--- chunk #2 EMPTY!
START looping on jdoc objects
END looping on jdoc objects

CODE (arduino IDE 2.3.2, ArduinoJson 7.2.0, ESP Async WebServer 3.3.20)

#include <ArduinoJson.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>

#include "ESPAsyncWebServer.h"

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html><head>
  <title>Test</title>
  </head><link rel="icon" href="data:,"><body>
    <form action="/" method="POST" accept-charset="utf-8">
    <input type="submit" onclick="onSubmit(event)" value="Submit">
</form> 

<script type="text/javascript">

  // handle the form submission event, prevent default form behaviour
  function onSubmit(event) {
    
    // prevent network error conplains
    event.preventDefault();

      let fdata = {A:"11111111",B:"22222222",C:"33333333",D:"44444444",
      E:"5555555",F:"66666666",G:"7777777",H:"8888888",I:"9999999",
      J:10,K:11,L:12,M:13,N:14,O:15};

      // send JSON data to server via POST
      fetch("/", {
        method: "POST",
        headers: new Headers({
          "Content-type": "application/json; charset=UTF-8"
          }),
        body: JSON.stringify(fdata) })
        .catch(error => { alert(error); });

  };

</script>
</body></html>)rawliteral";


AsyncWebServer webServer(80);

JsonDocument jdoc;
JsonObject jdocobj;

void setup() {

  Serial.begin(9600);
  delay(200);
    
  WiFi.mode(WIFI_STA);
  WiFi.begin("my_SSID","my_password");
  while (WiFi.status() != WL_CONNECTED) { delay(500); };
  webServer.begin();
  delay(500);

  webServer.on("/", HTTP_GET,[](AsyncWebServerRequest *request){
    request->send_P(200, "text/html", index_html);});

  webServer.on("/", HTTP_POST,[](AsyncWebServerRequest* request) {
    request->send_P(200, "text/html", index_html);}
    , nullptr,
    [](AsyncWebServerRequest* request, uint8_t* data,
      size_t len, size_t index, size_t total) {

        Serial.print("json body len,index,total = ");
        Serial.print(len);
        Serial.print(", ");
        Serial.print(index);
        Serial.print(", ");
        Serial.println(total);

        deserializeJson(jdoc,data,len);

        jdocobj = jdoc.as<JsonObject>();
        Serial.println("START looping on jdoc objects");
        for (JsonPair item: jdocobj) {
          Serial.print("key:");
          Serial.print(item.key().c_str());
          Serial.print("  value:");
          Serial.println(item.value().as<String>());
        }
        Serial.println("END looping on jdoc objects");

  });
}

void loop() {
  
  delay(100);

}

The text was updated successfully, but these errors were encountered:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

POST with fetch to ESPAsyncWebServer generates empty chunks #1443

POST with fetch to ESPAsyncWebServer generates empty chunks #1443

fabriziop commented Oct 26, 2024

POST with fetch to ESPAsyncWebServer generates empty chunks #1443

POST with fetch to ESPAsyncWebServer generates empty chunks #1443

Comments

fabriziop commented Oct 26, 2024