ESP-32 Загрузка файлов в SPIFFS через браузер

esp32 spiffs

Я использую библиотеку ESPAsyncWebServer в ESP32 DevKit. Хочу сделать форму в браузере для загрузки файлов в SPIFFS.

Я должен отметить, что все устройство работает отлично. Подключаюсь к Wi-Fi, он заливает файлы через IDE и т.д.

Поискав в сети, я нашел эту часть кода, которая не работает.

server.on("/upload-file", HTTP_GET, [](AsyncWebServerRequest* request) {
    String html = "<body><div><form method='post' action='/upload-file'><input type='file'><button>Send</button></form></div></body>";
    request->send(200, "text/html", html);
    });

server.on("/upload-file", HTTP_POST, [](AsyncWebServerRequest* request) {
    AsyncWebServerResponse* response = request->beginResponse(200, "text/html", "hello world");
    response->addHeader("Connection", "close");
    request->send(response);
    }, handleUpload);
server.onFileUpload(handleUpload);

Функция handleUpload:

void handleUpload(AsyncWebServerRequest *request, String filename, size_t index, uint8_t *data, size_t len, bool final){
if (!index) {
    request->_tempFile = SPIFFS.open("/" + filename, "w");
}
if (len) {
    request->_tempFile.write(data, len);
}
if (final) {
    request->_tempFile.close();
    request->redirect("/files");
}
}

Форма отображается, но файл не загружается. Есть ли идеи, как заставить это работать?

, 👍2

Обсуждение

как далеко это зайдет? Браузер перенаправляется после загрузки? Я бы добавил операторы Serial.println("saw1") (а также 2, 3 и т. д.) к каждой функции, чтобы отслеживать поток. Если это сделано полностью или в коде последней рабочей части, начните регистрировать аргументы функции, чтобы увидеть, где все идет не так, как ожидалось., @dandavis


1 ответ


2

У меня была такая же проблема, и благодаря вам я ее решил!

Вот полный код, Мой html-код страницы загрузки, форма в теге:


<!DOCTYPE html>
<html>
<head>
  <title>File Upload Example</title>
</head>
<body>
  <h1>File Upload Example</h1>
<form method="POST" action="/upload" enctype="multipart/form-data" target="iframe"><input type="file" name="upload"><input type="submit" value="Upload"></form>
<iframe style="visibility: hidden;" src="http://" )+local_IPstr+"/Usm" name="iframe"></iframe>
</body>
</html>

код для ESP:


void handleUpload(AsyncWebServerRequest *request, String filename, size_t index, uint8_t *data, size_t len, bool final){
if (!index) {
    request->_tempFile = SPIFFS.open("/" + filename, "w");
    Serial.println("1");
}
if (len) {
    request->_tempFile.write(data, len);
     Serial.println("2");
}
if (final) {
   Serial.println("3");
    request->_tempFile.close();
    request->redirect("/");
}
}



 controlserver.on("/upload", HTTP_POST, [](AsyncWebServerRequest *request) {
        request->send(200); }, handleUpload);
        


  controlserver.on("/UPL", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/html", upl);
  });


  readFile(SPIFFS, "/11.txt"); // показываем содержимое загруженного файла, очевидно, вы должны знать имя загруженного файла!

вы можете написать такую функцию, чтобы убедиться, что файл доставлен:

  readFile(fs::FS &fs, const char * path){
  Serial.printf("Reading file: %s\r\n", path);
  File file = fs.open(path, "r");
  if(!file || file.isDirectory()){
    Serial.println("- empty file or failed to open file");
    return String();
  }
  Serial.println("- read from file:");
  String fileContent;
  while(file.available()){
    fileContent+=String((char)file.read());
  }
  file.close();
  Serial.println(fileContent);

}
,