本文将引导如何使用ESP32开发板和Asynchronous Web Server创建一个复杂的应用程序。将探讨如何存储必要的文件（如JavaScript源代码、样式表、图片等），以及如何利用双核心板的优势。
用户需要熟悉ArduinoIDE和C++编程。本文假设用户已经安装了一些组件，但在专门的段落中，可以找到使用应用程序所需的必要参考。用户通过访问应用程序，可以向浏览器发送一个表单，用户可以在其中更改板上的时间，请求湿度和温度值（DHT22传感器），以及查看文件系统的内容。
如果IDE无法关联COM端口，这意味着缺少适当的驱动程序。以下是解决此问题的步骤：
源代码包括一个文件夹，其中包含所有所需的数据。当它安装在ESP32板上时，必须激活Sermig_Condor WiFi服务，并通过浏览器访问IP地址192.168.1.1。最终，可以通过串行端口向板发送一些命令。
index.html - 主页
formgen.js - 生成表单的脚本（参见文章“A JavaScript Form Generator”）
formgen.css - 生成表单的样式表
图片文件
以下是创建WEB服务器的代码片段：
#include <WiFi.h>
#include <AsyncTCP.h>
#include "ESPAsyncWebServer.h"
// SSID & Password ******************************************************
const char* ssid = "Sermig_Condor";
const char* password = "";
// IP Address ***********************************************************
IPAddress local_ip(192, 168, 1, 1);
IPAddress gateway(192, 168, 1, 1);
IPAddress subnet(255, 255, 255, 0);
AsyncWebServer server(80); // Object of WebServer(HTTP port, 80 is default)
void setup() {
...
WiFi.softAP(ssid, password);
delay(2000); // to avoid crash on WiFi connection
WiFi.softAPConfig(local_ip, gateway, subnet);
Serial.printf("Connect to Access Point: %s\n", ssid);
server.on("/", HTTP_ANY, [](AsyncWebServerRequest *request) {
...
});
server.onNotFound([](AsyncWebServerRequest *request){request->send(404);});
server.serveStatic("/", SPIFFS, "/");
server.begin();
...
}
void loop() {
// this can be empty
}
处理请求的代码如下：
server.on("/", HTTP_ANY, [](AsyncWebServerRequest *request) {
if(request->hasArg("fnz")) {
String type = request->arg("fnz");
AsyncResponseStream *response = request->beginResponseStream("text/html");
if(type == "Dir") {
// send Filesystem contents
response->print(dir());
request->send(response);
} else if(type == "Clock") {
// set an internal Clock
setTime(toSeconds(request->arg("time").c_str()));
response->printf("New time: %s", getTime());
request->send(response);
} else if(type == "Temp") {
// get humidity and temperature
response->printf("%s %s", getTime(), getTemperature());
request->send(response);
}
} else {
request->send(SPIFFS, "/index.html"); // send the form
}
});
文档：
需要以下两个库：
并将它们解压到Arduino libraries文件夹中，注意删除文件夹名称中的-master后缀。
SPIFFS文件系统非常有用，但有一些限制。它具有平坦结构，即不支持目录。目前，它不检测或处理坏块。Flash内存限制为10,000次写入周期。文件名（包括扩展名）限制为31个字符。
安装（参考此）：
如果安装成功，在IDE菜单的Tools中将出现ESP32Sketch Data Upload项，它允许将data文件夹中的内容上传到SPIFFS文件系统。