ESP32-S3 WiFi 实验 —— 手机网页控制 LED
在本实验中，我们将学习如何让 ESP32-S3 通过 WiFi 搭建一个简单的网页服务器，从而实现手机端网页控制开发板上的 LED 灯开关。
一、实验名称
WiFi实验
二、接线说明
| 设备 | ESP32-S3 |
|---|---|
| LED模块 D1 | 3号引脚 |
注意事项：
- 手机和 ESP32-S3 必须在同一网络（同一局域网内），IP 地址在同一网段（例如 192.168.1.xxx）。
- 通过串口监视器获取 ESP32-S3 的 IP 地址，然后在手机浏览器输入该 IP 地址即可访问网页。
三、实验现象
程序下载成功后：
- ESP32-S3 连接 WiFi。
- 串口监控输出板子的 IP 地址。
- 在手机浏览器输入该 IP 地址访问网页。
- 网页上提供两个链接，点击即可控制 LED 灯开/关。
四、完整代码示例
#include "public.h"
#include <WiFi.h>const char* ssid = "puzhong88"; // WiFi 名称
const char* password = "PUZHONG88"; // WiFi 密码WiFiServer server(80); // 创建 Web 服务器，端口 80// LED 控制引脚
#define led_pin 3// WiFi 连接函数
void wifi_connect(void)
{Serial.print("Connecting to ");Serial.println(ssid);WiFi.begin(ssid, password);while (WiFi.status() != WL_CONNECTED) {delay(500);Serial.print(".");}Serial.println("");Serial.println("WiFi connected.");Serial.println("IP address: ");Serial.println(WiFi.localIP());
}void setup(){Serial.begin(115200);pinMode(led_pin, OUTPUT); // 设置 LED 引脚为输出模式delay(10);wifi_connect(); // 连接 WiFiserver.begin(); // 启动服务器
}void loop(){WiFiClient client = server.available(); // 监听客户端请求if (client) { // 如果有客户端连接Serial.println("New Client.");String currentLine = ""; // 保存客户端请求数据while (client.connected()) { // 客户端连接期间循环if (client.available()) { // 如果有数据可读char c = client.read(); // 读取字节Serial.write(c);if (c == '\n') { // 新行表示 HTTP 请求结束if (currentLine.length() == 0) { // 两个换行符，HTTP 请求结束// 发送 HTTP 响应头client.println("HTTP/1.1 200 OK");client.println("Content-type:text/html");client.println();// 网页内容client.print("Click <a href=\"/H\">here</a> to turn the LED on pin 3 on.<br>");client.print("Click <a href=\"/L\">here</a> to turn the LED on pin 3 off.<br>");client.println();break;} else {currentLine = "";}} else if (c != '\r') { // 忽略回车currentLine += c;}// 根据请求控制 LEDif (currentLine.endsWith("GET /H")) {digitalWrite(led_pin, HIGH); // 打开 LED}if (currentLine.endsWith("GET /L")) {digitalWrite(led_pin, LOW); // 关闭 LED}}}// 关闭客户端连接client.stop();Serial.println("Client Disconnected.");}
}
五、代码讲解
- WiFi 连接
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) { ... }
- ESP32-S3 连接指定 WiFi，并通过串口输出连接状态和 IP 地址。
- 网页服务器
WiFiServer server(80);
server.begin();
- 创建并启动一个 HTTP 服务器，监听端口 80。
- 处理客户端请求
WiFiClient client = server.available();
- 当有客户端连接时，读取 HTTP 请求，并判断请求路径
/H或/L来控制 LED。
- 网页响应
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.print("Click <a href=\"/H\">here</a> ...");
- 发送 HTTP 响应头和网页内容，生成简单的控制界面。
六、实验效果
- ESP32-S3 连接到 WiFi，串口显示 IP 地址，例如：
192.168.1.123。 - 手机浏览器输入该 IP 地址即可访问网页。
- 网页上点击链接即可控制 LED 灯开/关。
七、进阶应用
-
多路控制
可扩展多个 LED 或继电器，通过网页控制多路设备。 -
数据反馈
在网页上显示 LED 状态或传感器数据，实现双向控制。 -
智能家居
结合温湿度传感器、继电器、摄像头等，实现物联网智能控制。
八、总结
本实验通过 ESP32-S3 WiFi 模块 实现网页控制 LED，掌握了：
- WiFi 连接与状态检查
- HTTP 服务器搭建
- 客户端请求解析与设备控制
这是学习 ESP32 IoT 项目、智能家居与远程控制的重要基础。