ESP32应用开发-Webserver

文章目录
    • 库调用
    • 实例
    • 实现思路
    • 技术要点
      • 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 lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="stylesheet" href="styleLoading.css"> <title>沃进DTU配置系统</title><style></style>
</head>
<body><div class="content"><div><div class="casePage"><div class="disflex" style="justify-content: space-between;"><div class="titltInfo disflex"><div class="title_wayos" style="margin-bottom: 10px;"><a href="https://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, [=]() {StaticJsonDocument<1024> 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,操作方式GET,Arduino的编译链为c++,是支持lambda函数的,锁直接把函数传参直接写在调用处,是不是很方便。

  • serializeJson把json对象格式化成String

  • c_str()String转换成char *

  • server.arg("username")获取前端传递的路径中的参数username

    server.on(“/upd_pwd”, HTTP_GET, {
    String username = server.arg(“username”);
    StaticJsonDocument<512> doc;
    doc[“code”] = 201;
    String jsonString;
    serializeJson(doc, jsonString);
    server.send(200, “text/json”, jsonString.c_str());
    });

3. http-POST路由

访问路径/upd_pwd,操作方式POST,Arduino的编译链为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”);
    StaticJsonDocument<512> 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”];
    StaticJsonDocument<512> doc_ret;
    doc_ret[“code”] = 201;
    String jsonString;
    serializeJson(doc_ret, jsonString);
    server.send(200, “text/json”, jsonString.c_str());
    }
    });

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/494446.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

软件设计与体系结构

1.简要说明什么是软件体系结构&#xff0c;软件体系结构模型&#xff0c;为什么要建立软件体系结构模型&#xff1f; 答&#xff1a;软件体系结构指一个软件系统在高层次上的结构化组织方式&#xff0c;包括系统的组成部分和各个部分之间的关系&#xff0c;以及它们与环境之间的…

开发手札:CameraRTS精准性优化

虽然三维软件提供了基本的物体RTS操作&#xff0c;但是对于用户来说过于复杂。 这些操作方式需要用户理解什么是三维空间、XYZ坐标系、欧拉角等。但是用户视角下&#xff0c;就一个二维屏幕动来动去的鼠标光标。 之前写过一套RTM组件&#xff0c;RTM组件&#xff0…

高级的SQL查询技巧有哪些?

成长路上不孤单&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a; 【14后&#x1f60a;///C爱好者&#x1f60a;///持续分享所学&#x1f60a;///如有需要欢迎收藏转发///&#x1f60a;】 今日分享关于高级SQL查询技巧方面的相关内容&#xf…

helm的介绍和安装

1 helm概述 1.1 资源对象难以管理的问题 helm是k8s资源清单的管理工具&#xff0c;它就像Linux下的包管理器&#xff0c;比如centos的yum&#xff0c;ubuntu的apt helm&#xff1a;命令行工具&#xff0c;主要用于k8s的chart的创建&#xff0c;打包&#xff0c;发布和管理。…

专业的内外网数据交换方案 可解决安全、效率、便捷3大问题

内外网数据交换是很多企业和行业都会面临的场景&#xff0c;既然隔离了内外网&#xff0c;重中之重就是要确保数据的安全性&#xff0c;其次在数据流转交换过程中&#xff0c;不能太繁琐复杂&#xff0c;需要让用户快速、便捷的进行数据交换。首先我们来看看&#xff0c;在进行…

2024 楚慧杯 re wp

go_bytes 附件拖入ida 输入长度为0x28&#xff0c;每两位字符的4bit拼接 与一个常量值经过运算后的值进行异或&#xff0c;并且判断是否相等 脚本 bouquet 附件拖入ida。简单去一下花 构建了一个二叉树&#xff0c;然后递归调用函数 重新排列一下再层序遍历读出即可 zistel 附件…

BERT模型入门(1)BERT的基本概念

文章目录 BERT是Bidirectional Encoder Representations from Transformers的首字母简写&#xff0c;中文意思是&#xff1a;Transformer的双向编码器表示。它是谷歌发布的最先进的嵌入模型。BERT在许多NLP任务中提供了更好的结果&#xff0c;如问答、文本生成、句子分类等&…

ECharts关系图-关系图11,附视频讲解与代码下载

引言&#xff1a; 关系图&#xff08;或称网络图、关系网络图&#xff09;在数据可视化中扮演着至关重要的角色。它们通过节点&#xff08;代表实体&#xff0c;如人、物体、概念等&#xff09;和边&#xff08;代表实体之间的关系或连接&#xff09;的形式&#xff0c;直观地…

java全栈day19--Web后端实战(java操作数据库3)

一、MyBatis 1.1介绍 前提引入&#xff1a; controller(控制层)作用&#xff1a;接受请求&#xff0c;响应数据 service(业务层)作用&#xff1a;负责具体的逻辑处理 dao(持久层)作用&#xff1a;数据访问层 一般的访问流程&#xff1a;浏览器发起请求过来&#xff0c;先…

Hmsc包开展群落数据联合物种分布模型分析通用流程(Pipelines)

HMSC&#xff08;Hierarchical Species Distribution Models&#xff09;是一种用于预测物种分布的统计模型。它在群落生态学中的应用广泛&#xff0c;可以帮助科学家研究物种在不同环境条件下的分布规律&#xff0c;以及预测物种在未来环境变化下的潜在分布范围。 举例来说&a…

PostgreSQL 的历史

title: PostgreSQL 的历史 date: 2024/12/23 updated: 2024/12/23 author: cmdragon excerpt: PostgreSQL 是一款功能强大且广泛使用的开源关系型数据库管理系统。其历史可以追溯到1986年,当时由加州大学伯克利分校的一个研究团队开发。文章将深入探讨 PostgreSQL 的起源、…

CSPM认证最推荐学习哪个级别?

一、什么是CSPM&#xff1f; CSPM的全称是Certified Strategic Project Manager&#xff0c;中文名称为“项目管理专业人员能力评价等级证书”。这是由中国标准化协会依据国家标准《项目管理专业人员能力评价要求》&#xff08;GB/T 41831-2022&#xff09;推出的一项认证&…

车载网关性能 --- GW ECU报文(message)处理机制的技术解析

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 所谓鸡汤,要么蛊惑你认命,要么怂恿你拼命,但都是回避问题的根源,以现象替代逻辑,以情绪代替思考,把消极接受现实的懦弱,伪装成乐观面对不幸的…

IT运维的365天--021 服务器上的dns设置后不起作用

之前在内网搭建了一个和外网同域名的网站&#xff0c;开发同事今天告诉我&#xff0c;程序调试发现可能服务器不能正常访问自己内网的网站内容。于是&#xff0c;今天的故事开始了。 前面的文章在下面列出&#xff0c;当然不看也问题不大&#xff0c;今天的主题是&#xff1a;…

任务2 配置防火墙firewalld

基本概念 概述 支持动态更新防火墙规则 不重启即可创建、修改和删除规则 使用区域和服务来简化防火墙配置 区域 一组预定义的规则&#xff0c;防火墙策略集合&#xff08;或策略模板&#xff09; 把网络分配到不同的区域中&#xff0c;并为网络及其关联的网络接口或流量源…

FPGA(一)verilog语句基础

Verilog 是一种硬件描述语言&#xff08;HDL&#xff09;&#xff0c;常用于数字电路的设计、模拟和验证&#xff0c;特别是用于 FPGA 和 ASIC 的设计。Verilog 让设计者能够描述和模拟硬件系统的行为和结构&#xff0c;最终将其转化为硬件电路。 一、模块结构 Verilog 中的设计…

Asp.Net FrameWork 4.7.2 WebAPI 使用WebSocket协议

参考文章&#xff1a;Asp.net webApi 通过WebSocket推送消息给客户端&#xff0c;搭建一个即是服务端又是客户端的服务_c# webapi websocket-CSDN博客 WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket通信协议于2011年被IETF定为标准RFC 6455&#xff0c;并由…

网关的国际化改造

网关的国际化改造和web服务的改造有所不同。 问题 SpringCloud Gateway是基于reactor模型的&#xff0c;按照SpringBoot那套以及所尝试网上以及AI的i18n国际化方案&#xff0c;都没有成功。 解决问题 基本思路跟SpringBoot项目的i18n一样 通过MessageSource加载messages国际…

数据分析思维(五):分析方法——假设检验分析方法

数据分析并非只是简单的数据分析工具三板斧——Excel、SQL、Python&#xff0c;更重要的是数据分析思维。没有数据分析思维和业务知识&#xff0c;就算拿到一堆数据&#xff0c;也不知道如何下手。 推荐书本《数据分析思维——分析方法和业务知识》&#xff0c;本文内容就是提取…

5G学习笔记之Non-Public Network

目录 0. NPN系列 1. 概述 2. SNPN 2.1 SNPN概述 2.2 SNPN架构 2.3 SNPN部署 2.3.1 完全独立 2.3.2 共享PLMN基站 2.3.3 共享PLMN基站和PLMN频谱 3. PNI-NPN 3.1 PNI-NPN概述 3.2 PNI-NPN部署 3.2.1 UPF独立 3.2.2 完全共享 0. NPN系列 1. NPN概述 2. NPN R18 3. 【SNPN系列】S…