嵌入式开发服务器与客户端交互日志2024/7/31

嵌入式开发服务器与客户端交互

客户端网页操作请求相关代码:

这里为了适配低版本浏览器用的不是fetch

当然用fetch更好

  var curUlr = window.location.href; //获取当前网页地址var newURL = curUlr.lastIndexOf("/");//截取到最后一个斜杠索引var pathUrl = curUlr.substring(0, newURL);//通过索引截取字符串地址var ledset = {}; //创建一个对象onclick = function (e) {  //检测按钮事件var butid = e.target.id;  //获取当前按钮IDconsole.log(butid);  //输出控制台if (butid.startsWith("g")) { //检车id是否为g开头if (ledset[butid] == 1) { //检测对象中 id对应的值是否是 1e.target.checked = false; // input type="radio" 单选 取消delete ledset[butid]; //清除这个键值对} else {ledset[butid] = 1; //反之 添加键值对 id:1}}console.log(ledset); //控制台输出 对象};  function setLED() { //按钮函数 console.log("发送:" + JSON.stringify(ledset)); //控制台输出 JSON转化对象var Urll= pathUrl+"/setLED"; //拼接请求地址var xhr = new XMLHttpRequest(); //创建新的异步请求xhr.open("POST", Urll, true);   //设置请求格式 xhr.send(JSON.stringify(ledset)); //发送JSON数据};

单片机处理: 服务器库>> <ESP8266WebServer.h>

关键处理代码 :

void setLed()
{Serial.println("处理上载数据中!"); 
// 打印一条消息，表示正在处理上传的数据if (ESP_server.hasArg("plain")) { 
// 检查HTTP请求中是否包含名为"plain"的参数String postData = ESP_server.arg("plain"); 
// 如果参数存在，获取其值并存储在String类型的postData变量中StaticJsonDocument<1024> doc; // 创建一个StaticJsonDocument对象，用于解析JSON数据。// 分配1024字节空间 给JSON数据，DeserializationError error = deserializeJson(doc, postData); // 使用ArduinoJson库的deserializeJson函数尝试将postData字符串解析为JSON文档。
//如果解析过程中出现错误，error将包含错误信息Serial.println(postData); 
// 打印接收到的原始POST数据，确认数据是否正确接收ESP_server.send(200);//向客户端发送一个确认响应，表示数据已被接收且处理完了!}
}void setup(){ESP_server.on("/setLED", HTTP_POST,setLed); 
}void loop(){
ESP_server.handleClient();
}