如何通过SPIFFS从HTML表单获取数据到ESP32并打印至串口监视器

你的问题在于当前代码仅处理了/html路径的页面请求，没有监听表单提交的/get路径，因此无法获取用户输入的数据。以下是具体修改步骤：

1. 修改Arduino代码，添加GET请求处理 #

在server.begin();之前，添加对/get路径的GET请求处理逻辑，用于提取表单参数并打印到串口：

#include "WiFi.h"
#include "SPIFFS.h"
#include "ESPAsyncWebServer.h"
 
const char* ssid = "ramesh";
const char* password =  "rameshlike";
 
AsyncWebServer server(80);
 
void setup(){
  Serial.begin(115200);
 
  if(!SPIFFS.begin()){
        Serial.println("An Error has occurred while mounting SPIFFS");
        return;
  }
 
  WiFi.begin(ssid, password);
 
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi..");
  }
 
  Serial.println(WiFi.localIP());
 
  server.on("/html", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(SPIFFS, "/test_file.html", "text/html");
  });

  // 处理表单提交的GET请求
  server.on("/get", HTTP_GET, [](AsyncWebServerRequest *request){
    // 检查并获取字符串参数
    if(request->hasParam("input_string")){
      String inputStr = request->getParam("input_string")->value();
      Serial.print("用户输入的字符串: ");
      Serial.println(inputStr);
    }
    // 检查并获取整数参数
    if(request->hasParam("input_int")){
      String inputIntStr = request->getParam("input_int")->value();
      int inputInt = inputIntStr.toInt();
      Serial.print("用户输入的整数: ");
      Serial.println(inputInt);
    }
    // 检查并获取浮点数参数
    if(request->hasParam("input_float")){
      String inputFloatStr = request->getParam("input_float")->value();
      float inputFloat = inputFloatStr.toFloat();
      Serial.print("用户输入的浮点数: ");
      Serial.println(inputFloat);
    }
    // 返回空响应，避免浏览器报错
    request->send(200, "text/plain", "");
  });
 
  server.begin();
}
 
void loop(){}

2. 优化HTML表单（可选） #

原HTML中浮点数输入框的type="number"默认只能输入整数，添加step="any"可以支持小数输入，修改后的浮点数表单部分：

<form action="/get" target="hidden-form">
  Enter Floating value <input type="number" step="any" name="input_float">
  <input type="submit" value="Submit" onclick="message_popup()">
</form>

3. 测试验证 #

• 将修改后的代码上传到ESP32
• 打开串口监视器，波特率设置为115200
• 访问ESP32的IP地址+/html（比如192.168.x.x/html）
• 在表单中输入内容并提交，即可在串口监视器看到对应的输入数据打印输出

内容的提问来源于stack exchange，提问作者ramesh adhikari