实验场景图

控制LED后的实验串口返回情况

在手机端打开浏览器，输入IP地址：192.168.4.1
使用面板上的两个按钮，即可控制LED的亮灭

在手机端打开WiFi ,输入密码，连接ESP8266_AP

实验串口返回情况

代码解读：
1、包含库：
#include ：包含ESP8266WiFi库，用于WiFi连接。
#include ：包含ESP8266WebServer库，用于创建Web服务器。
2、定义网络凭据：
const char* ssid = "ESP_AP";：定义要广播的SSID。
const char* password = "12345678";：定义WiFi密码，必须至少为8个字符。
3、创建全局变量：
String http;：存储HTTP请求的内容。
String output2State = "off";：存储GPIO 2的状态。
String output0State = "off";：存储GPIO 0的状态。
4、定义服务端和客户端：
WiFiServer server(80);：创建WiFiServer对象，监听80端口。
WiFiClient client;：创建WiFiClient对象。
5、初始化设置（setup函数）：
初始化串口通信，设置波特率为9600。
设置GPIO 2和GPIO 0为输出模式，初始状态为低电平。
创建ESP32接入点。
打印接入点的IP地址。
启动ESP32服务器。
6、主循环（loop函数）：
检查是否有新的客户端连接。
处理客户端请求并解析HTTP数据。
发送HTTP响应和更新网页。
断开客户端连接。
7、发送HTTP响应（sendResponse函数）：
发送HTTP响应头信息。
8、更新网页内容（updateWebpage函数）：
发送整个HTML页面，包括按钮和LED状态。
9、更新LED状态（updateLED函数）：
根据HTTP请求更新LED状态。

【花雕学编程】239种传感器执行器系列实验（资料代码+仿真编程+图形编程）
实验二百四十六：ESP8266串口wifi模块 NodeMCU Lua V3物联网开发板 CH340
实验项目之十三：使用 Web 服务器的 ESP8266 LED 控制
实验开源代码
[code]/*
【花雕学编程】239种传感器执行器系列实验（资料代码+仿真编程+图形编程）
实验二百四十六：ESP8266串口wifi模块 NodeMCU Lua V3物联网开发板 CH340
实验项目之十三：使用 Web 服务器的 ESP8266 LED 控制
*/
#include // 包含ESP8266WiFi库，用于WiFi连接
#include // 包含ESP8266WebServer库，用于创建Web服务器
#define output2 2
#define output0 0
// 定义AP模式的SSID和密码
const char* ssid = "ESP8266_AP"; // 这是ESP8266将广播的SSID
const char* password = "12345678"; // 密码至少应为8个字符
// 创建全局变量
String http;
String output2State = "off";
String output0State = "off";
// 定义服务端和客户端
WiFiServer server(80); // 创建一个WiFiServer对象，监听80端口
WiFiClient client; // 创建一个WiFiClient对象
void setup() {
Serial.begin(9600); // 初始化串口通信，波特率为9600
Serial.println(" ");
Serial.println(" ");
pinMode(2, OUTPUT); // 设置GPIO 2为输出模式
pinMode(0, OUTPUT); // 设置GPIO 0为输出模式
digitalWrite(2, LOW); // 初始化GPIO 2为低电平
digitalWrite(0, LOW); // 初始化GPIO 0为低电平
Serial.print("Connecting to ");
Serial.println(ssid);
// 创建ESP8266接入点
WiFi.softAP(ssid, password);
Serial.println("");
Serial.println("WiFi AP is now running");
Serial.println("IP address: ");
Serial.println(WiFi.softAPIP());
// 启动ESP8266服务器
server.begin();
}
void loop() {
client = server.available(); // 检查是否有新的客户端尝试连接到服务器
if (client) {
Serial.println("New Client.");
String clientData = "";
while (client.connected()) { // 等待客户端完成HTTP请求的发送
if (client.available()) { // 如果有数据
char c = client.read(); // 读取一个字符
http += c; // 解析它
Serial.write(c);
if (c == '\n') { // 如果字符是换行符
// 表示客户端HTTP请求结束
if (clientData.length() == 0) { // 清空clientData
sendResponse(); // 执行必要操作
updateLED();
updateWebpage();
break;
} else {
clientData = ""; // 清空clientData
}
} else if (c != '\r') { // 如果字符不是回车符
clientData += c; // 将字符存储到clientData变量中
}
}
}
http = "";
client.stop(); // 断开客户端连接
Serial.println("Client disconnected.");
Serial.println("");
}
}
void sendResponse() {
// 发送HTTP响应头
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.println("Connection: close");
client.println();
}
void updateWebpage() {
// 发送整个HTML页面
client.println("");
client.println("");
client.println("");
client.println("");
client.println("");
client.println("");
client.println("");
// 网页标题
client.println("

ESP Web Server!

");
// 显示蓝色LED的按钮
client.println("

1. GPIO 2 is " + output2State + "

");
if (output2State == "off") {
client.println("

Turn ON

");
} else {
client.println("

Turn OFF

");
}
client.print("

---

");
// 显示绿色LED的按钮
client.println("

2. GPIO 0 is " + output0State + "

");
if (output0State == "off") {
client.println("

Turn ON

");
} else {
client.println("

Turn OFF

");
}
client.println("");
client.println();
}
void updateLED() {
if (http.indexOf("GET /2/on") >= 0) {
Serial.println("GPIO 2 LED on");
output2State = "on";
digitalWrite(2, HIGH);
} else if (http.indexOf("GET /2/off") >= 0) {
Serial.println("GPIO 2 LED off");
output2State = "off";
digitalWrite(2, LOW);
} else if (http.indexOf("GET /0/on") >= 0) {
Serial.println("GPIO 0 LED on");
output0State = "on";
digitalWrite(0, HIGH);
} else if (http.indexOf("GET /0/off") >= 0) {
Serial.println("GPIO 0 off");
output0State = "off";
digitalWrite(0, LOW);
}
}[/code]

所需零件
在本案例中，我们将控制两个 LED。因此，我们需要以下部分：
ESP8266开发板
两个 LED
面包板
跳线