网站没有收录,精美图片做网站上哪儿去找图,页面网站缓存如何做,丰台网站建设公司文章目录 库调用实例实现思路技术要点 1. 前端涉及的文件需要包装再发送2. http-GET路由3. http-POST路由 开发环境#xff1a;Arduino
库调用
#include WebServer.h
#include ArduinoJson.h //IDE没有自带#xff0c;需自行安装实例
WebServer server…文章目录 库调用实例实现思路技术要点 1. 前端涉及的文件需要包装再发送2. http-GET路由3. http-POST路由 开发环境Arduino
库调用
#include WebServer.h
#include ArduinoJson.h //IDE没有自带需自行安装实例
WebServer server(80);static const char index_html[] PROGMEM R( !DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0link relstylesheet hrefstyleLoading.css title沃进DTU配置系统/titlestyle/style
/head
bodydiv classcontentdivdiv classcasePagediv classdisflex stylejustify-content: space-between;div classtitltInfo disflexdiv classtitle_wayos stylemargin-bottom: 10px;a hrefhttps://vollgo.cn/沃进科技/a/div/div/div/div/div/div
/body
script
/script
/html); void setup() {Serial.begin(115200);Serial.println(system start);IPAddress apIP({192, 168, 4, 1}); //设置AP的IP地址WiFi.mode(WIFI_AP_STA);WiFi.softAPConfig(apIP, apIP, IPAddress({255, 255, 255, 0}));server.on(/, []() {server.send(200, text/html, FPSTR(index_html));});server.on(/index.html, []() {server.send(200, text/html, FPSTR(index_html));});server.on(/wifi_params, HTTP_GET, []() {StaticJsonDocument1024 doc;doc[code] 200;doc[message][ssid] 12345;String jsonString;serializeJson(doc, jsonString);Serial.println(jsonString);server.send(200, text/json, jsonString.c_str());});server.onNotFound([](){String message File Not Found;message URI: ;message server.uri();message
Method: ;message (server.method() HTTP_GET) ? GET : POST;message
Arguments: ;message server.args();message
;for (uint8_t i 0; i server.args(); i) {message server.argName(i) : server.arg(i)
;}server.send(404, text/plain, message);// digitalWrite(led, 0);});server.begin();
}
void loop() {delay(1);server.handleClient();
}实现思路
ESP32作为AP模式终端连接该AP通过地址即可访问该web服务器了前端界面文件通过http GET方式获取包括css文件图片js文件等。
技术要点
1. 前端涉及的文件需要包装再发送
static const char index_html[] PROGMEM R(
); 把整个前端文件的内容放在()括号里。
2. http-GET路由
访问路径/upd_pwd操作方式GETArduino的编译链为c是支持lambda函数的锁直接把函数传参直接写在调用处是不是很方便。 serializeJson把json对象格式化成String c_str()把String转换成char * server.arg(username)获取前端传递的路径中的参数username server.on(“/upd_pwd”, HTTP_GET, { String username server.arg(“username”); StaticJsonDocument512 doc; doc[“code”] 201; String jsonString; serializeJson(doc, jsonString); server.send(200, “text/json”, jsonString.c_str()); });
3. http-POST路由
访问路径/upd_pwd操作方式POSTArduino的编译链为c是支持lambda函数的锁直接把函数传参直接写在调用处是不是很方便。 post消息体的body数据放在plain字段中以json字符串的形式存放。 serializeJson把json对象格式化成String c_str()把String转换成char * server.arg(username)获取前端传递的路径中的参数username const char *ip doc[server];获取json对象的server字段的值 server.on(“/upd_pwd”, HTTP_POST, { String body server.arg(“plain”); StaticJsonDocument512 doc; DeserializationError error deserializeJson(doc, body.c_str()); if(error) { server.send(400, “text/json”, “{“success”: 400, “message”:“json error”}”); } else { const char *ip doc[“server”]; StaticJsonDocument512 doc_ret; doc_ret[“code”] 201; String jsonString; serializeJson(doc_ret, jsonString); server.send(200, “text/json”, jsonString.c_str()); } });
