ESP32 WiFi连接入门

项目简介

ESP32 是一款功能强大的微控制器，内置 WiFi 和蓝牙功能，是物联网（IoT）项目的理想选择。本教程将带你完成 ESP32 的 WiFi 连接，并搭建一个简单的 Web 服务器，通过手机或电脑浏览器远程控制 LED 灯。

你将学到：

ESP32 的基本特性和与 Arduino 的区别
如何使用 Arduino IDE 为 ESP32 编程
WiFi 连接的基本方法
搭建简单 HTTP Web 服务器

认识 ESP32

ESP32 相比 Arduino Uno 有以下优势：

特性	Arduino Uno	ESP32
处理器	8位 AVR	32位双核 Xtensa
主频	16 MHz	240 MHz
RAM	2 KB	520 KB
WiFi	❌	✅ 内置
蓝牙	❌	✅ 内置
模拟引脚	6个	18个

所需材料

材料	数量
ESP32 开发板	1块
USB 数据线（Type-C 或 Micro-USB）	1根
LED 灯	1个
220Ω 电阻	1个
面包板 + 跳线	若干

连接 WiFi

首先，让 ESP32 连接到你的 WiFi 网络：

cpp

#include <WiFi.h>
// 替换为你的 WiFi 信息 const char* ssid = "你的WiFi名称"; const char* password = "你的WiFi密码";
void setup() {   Serial.begin(115200);      // 连接 WiFi   WiFi.begin(ssid, password);   Serial.print("正在连接 WiFi");      while (WiFi.status() != WL_CONNECTED) {     delay(500);     Serial.print(".");   }      Serial.println();   Serial.println("WiFi 连接成功！");   Serial.print("IP 地址: ");   Serial.println(WiFi.localIP());  // 打印 IP 地址 }void loop() {   // 暂时为空 }

上传代码后，打开串口监视器（波特率 115200），你会看到 ESP32 的 IP 地址。

搭建 Web 服务器

现在让我们搭建一个 Web 服务器，通过浏览器控制 LED：

cpp

#include <WiFi.h> #include <WebServer.h>
const char* ssid = "你的WiFi名称"; const char* password = "你的WiFi密码"; const int LED_PIN = 2;  // ESP32 内置 LED
WebServer server(80);  // 在 80 端口启动服务器 bool ledState = false;
// 处理根路径请求 void handleRoot() {   String html = "<html><body style='font-family:Arial;text-align:center;padding:50px'>";   html += "<h1>小米创客 ESP32 控制台</h1>";   html += "<p>LED 状态: <b>" + String(ledState ? "开启" : "关闭") + "</b></p>";   html += "<a href='/on'><button style='padding:15px 30px;font-size:18px;background:#ff6900;color:white;border:none;border-radius:8px;margin:10px'>开灯</button></a>";   html += "<a href='/off'><button style='padding:15px 30px;font-size:18px;background:#333;color:white;border:none;border-radius:8px;margin:10px'>关灯</button></a>";   html += "</body></html>";   server.send(200, "text/html", html); }
void handleOn() {   ledState = true;   digitalWrite(LED_PIN, HIGH);   server.sendHeader("Location", "/");   server.send(302, "text/plain", ""); }
void handleOff() {   ledState = false;   digitalWrite(LED_PIN, LOW);   server.sendHeader("Location", "/");   server.send(302, "text/plain", ""); }
void setup() {   Serial.begin(115200);   pinMode(LED_PIN, OUTPUT);      WiFi.begin(ssid, password);   while (WiFi.status() != WL_CONNECTED) {     delay(500);     Serial.print(".");   }      Serial.println("\nWiFi 已连接，IP: " + WiFi.localIP().toString());      server.on("/", handleRoot);   server.on("/on", handleOn);   server.on("/off", handleOff);   server.begin();      Serial.println("Web 服务器已启动！");   Serial.println("在浏览器中访问: http://" + WiFi.localIP().toString()); }void loop() {   server.handleClient();  // 处理客户端请求 }

代码详解

WebServer server(80)： 创建一个监听 80 端口的 HTTP 服务器
server.on()： 注册 URL 路径和对应的处理函数
server.handleClient()： 在 loop 中持续处理来自客户端的请求
HTML 字符串： 直接在代码中生成 HTML 页面，发送给浏览器

进阶挑战

挑战1：添加更多控制 在网页上添加滑块，控制 LED 的亮度（使用 PWM）。

挑战2：显示传感器数据 将温湿度传感器的数据显示在网页上，每 5 秒自动刷新。

挑战3：接入 MQTT 使用 MQTT 协议，将 ESP32 接入物联网平台，实现远程监控。