ESP32C3：手机连接开发板创建的热点WEB后，输入可用WIFI信息后进行联网

本文主要是介绍ESP32C3：手机连接开发板创建的热点WEB后，输入可用WIFI信息后进行联网，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

客户端测试：

串口测试：

逻辑解释：

- `#include <WiFi.h>` 和 `#include <WebServer.h>` 导入了其它库，用于 ESP32C3 与 Wi-Fi 和 Web 服务器的交互。
- `const char* ssid = "ESP32C3";` 定义了 Wi-Fi AP 的名称。
- `WebServer server(80);` 创建了一个 Web 服务器对象，并将其绑定到 80 端口。
- `handleRoot()`: 当 Web 服务器收到根路径（/）的 GET 请求时，会调用该函数，它在客户端网页上显示输入 Wi-Fi 凭据的表单。
- `handleConnect()`: 当 Web 服务器收到路由为 /connect 的 POST 请求时，会调用该函数。该函数会从请求中获取 Wi-Fi 凭据并将其用于 Wi-Fi 连接。如果连接成功，则会向客户端发出成功消息；如果连接失败，则会向客户端发出失败信息。
- `setup()` 函数的作用是执行一些初始化操作，例如设置调试串口，开启 Wi-Fi 并将 ESP32 设置为 AP。它还将路由器映射到 `handleRoot()` 和 `handleConnect()` 函数上，并开始运行 Web 服务器。
- `loop()`函数是无限循环，在其中，调用 `server.handleClient()` 方法，以便服务器能够实时地处理客户端的请求。

代码部分：

#include <WiFi.h>
#include <WebServer.h>
const char* ssid = "ESP32C3";
WebServer server(80);
void handleRoot() {String html = "<form action='/connect' method='post'>Enter WiFi credentials:<br><input type='text' name='ssid' value=''><br><input type='password' name='password' value=''><br><input type='submit' value='Connect'></form>";server.send(200, "text/html", "<!DOCTYPE html><html><head><meta name='viewport' content='width=device-width, initial-scale=1.0'></head><body>"+html+"</body></html>");
}
void handleConnect() {String ssid = server.arg("ssid");String password = server.arg("password");Serial.println(ssid);Serial.println(password);WiFi.begin(ssid.c_str(), password.c_str());unsigned long timeout = millis();while (WiFi.status() != WL_CONNECTED && millis() - timeout < 10000) {delay(1000);}if (WiFi.status() == WL_CONNECTED) {server.send(200, "text/html", "<p>Connected to WiFi</p>");Serial.println("成功连接WIFI");} else {server.send(200, "text/html", "<p>Failed to connect to WiFi</p>");Serial.println("失败连接WIFI");}
}
void setup() {Serial.begin(115200);WiFi.mode(WIFI_AP_STA); // enable Station and AP modeWiFi.softAP(ssid);Serial.print("AP IP address: ");Serial.println(WiFi.softAPIP());server.on("/", handleRoot);server.on("/connect", HTTP_POST, handleConnect);server.begin();
}
void loop() {server.handleClient();
}

迭代版本：

1.增加LED展示效果：通电点亮+5V电源指示灯，联网成功双灯常亮模式，联网失败呼吸灯闪烁（失败后按RST重启连接热点重新给正确的WIFI信息）

2.增加企业微信机器人接口，联网成功会通知，通过访问：192.168.4.1/send?txt=XXX 还可进行消息推送

代码：

#define LED_BUILTIN_0 (12)
#define LED_BUILTIN_1 (13)#include <WiFi.h>
#include <WebServer.h>
#include <HTTPClient.h>
// 开发板热点名称
const char* ssid = "ESP32C3";
// 企业微信机器人 webhook URL
const char* webhookUrl = "请填写webhook URL";WebServer server(80);
void handleRoot() {String html = "<form action='/connect' method='post'>Enter WiFi credentials:<br><input type='text' name='ssid' value=''><br><input type='password' name='password' value=''><br><input type='submit' value='Connect'></form>";server.send(200, "text/html", "<!DOCTYPE html><html><head><meta name='viewport' content='width=device-width, initial-scale=1.0'></head><body>"+html+"</body></html>");
}
void handleSend() {if (WiFi.status() == WL_CONNECTED) {// 如 "/send?txt=test"，其中的 "txt=test" 就是一个参数，使用 server.arg("txt") 可以获取它的值，即 "test"String message = "ESP32C3推送消息：" + server.arg("txt");Serial.println("接收到推送消息：");Serial.println(message);sendToWechatWebhook(message); // 调用sendToWechatWebhook函数发送请求字符串信息server.send(200, "text/plain", "消息推送成功！"); // 告诉客户端请求已完成Serial.println("推送消息成功！");} else {server.send(200, "text/plain", "无法连接网络，请检查网络连接！"); // 网络连接失败，返回错误提示Serial.println("推送消息失败！");}
}
void handleConnect() {String ssid = server.arg("ssid");String password = server.arg("password");Serial.println(ssid);Serial.println(password);WiFi.begin(ssid.c_str(), password.c_str());unsigned long timeout = millis();while (WiFi.status() != WL_CONNECTED && millis() - timeout < 10000) {Serial.println("Connecting to WiFi...");delay(1000);}if (WiFi.status() == WL_CONNECTED) {server.send(200, "text/html", "<p>Connected to WiFi</p>");Serial.println("成功连接WIFI");// 连接成功灯常亮，亮度偏低analogWrite(LED_BUILTIN_0, 10);analogWrite(LED_BUILTIN_1, 10); // 发送消息到企业微信机器人String message = "ESP32C3 成功连接了 WiFi " + String(ssid);sendToWechatWebhook(message);} else {server.send(200, "text/html", "<p>Failed to connect to WiFi</p>");Serial.println("失败连接WIFI");while (true) {// 渐亮，范围0-255for (int i = 0; i < 100; i++) {analogWrite(LED_BUILTIN_0, i);analogWrite(LED_BUILTIN_1, i);delay(10); }// 渐灭范围255-0for (int i = 100; i >= 0; i--) {analogWrite(LED_BUILTIN_0, i);analogWrite(LED_BUILTIN_1, i);delay(10); }}}
}
void setup() {Serial.begin(115200);//只量一个电源灯pinMode(LED_BUILTIN_1, OUTPUT);WiFi.mode(WIFI_AP_STA); // enable Station and AP modeWiFi.softAP(ssid);Serial.print("AP IP address: ");Serial.println(WiFi.softAPIP());server.on("/", handleRoot);server.on("/connect", HTTP_POST, handleConnect);server.on("/send", HTTP_GET, handleSend); server.begin();
}
void loop() {server.handleClient();
}
void sendToWechatWebhook(String message) {HTTPClient https;https.begin(webhookUrl);String payload = "{\"msgtype\":\"text\",\"text\":{\"content\":\"" + message + "\"}}";int httpResponseCode = https.POST(payload);if (httpResponseCode == HTTP_CODE_OK) {Serial.println("Message sent to WeChat webhook");} else {Serial.println("Failed to send message to WeChat webhook");}https.end();
}

这篇关于ESP32C3：手机连接开发板创建的热点WEB后，输入可用WIFI信息后进行联网的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！