ESP32 C3 使用ConfigWiFi配网

ESP32C3 的配网方式有好多种，这里主要使用AP配网方式。在 ESP32C3 上建立热点AP，使用手机连接上后在浏览器打开配置网页，输入WIFI信息，完成配网。这种方式很可靠，而且允许在电脑端完成配网。
配网流程

#mermaid-svg-bsm5z8haG4zSCM0y {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .error-icon{fill:#552222;}#mermaid-svg-bsm5z8haG4zSCM0y .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-bsm5z8haG4zSCM0y .edge-thickness-normal{stroke-width:2px;}#mermaid-svg-bsm5z8haG4zSCM0y .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-bsm5z8haG4zSCM0y .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-bsm5z8haG4zSCM0y .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-bsm5z8haG4zSCM0y .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-bsm5z8haG4zSCM0y .marker{fill:#333333;stroke:#333333;}#mermaid-svg-bsm5z8haG4zSCM0y .marker.cross{stroke:#333333;}#mermaid-svg-bsm5z8haG4zSCM0y svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-bsm5z8haG4zSCM0y .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .cluster-label text{fill:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .cluster-label span{color:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .label text,#mermaid-svg-bsm5z8haG4zSCM0y span{fill:#333;color:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .node rect,#mermaid-svg-bsm5z8haG4zSCM0y .node circle,#mermaid-svg-bsm5z8haG4zSCM0y .node ellipse,#mermaid-svg-bsm5z8haG4zSCM0y .node polygon,#mermaid-svg-bsm5z8haG4zSCM0y .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-bsm5z8haG4zSCM0y .node .label{text-align:center;}#mermaid-svg-bsm5z8haG4zSCM0y .node.clickable{cursor:pointer;}#mermaid-svg-bsm5z8haG4zSCM0y .arrowheadPath{fill:#333333;}#mermaid-svg-bsm5z8haG4zSCM0y .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-bsm5z8haG4zSCM0y .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-bsm5z8haG4zSCM0y .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaid-svg-bsm5z8haG4zSCM0y .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaid-svg-bsm5z8haG4zSCM0y .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-bsm5z8haG4zSCM0y .cluster text{fill:#333;}#mermaid-svg-bsm5z8haG4zSCM0y .cluster span{color:#333;}#mermaid-svg-bsm5z8haG4zSCM0y div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-bsm5z8haG4zSCM0y :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}

yes

获取SSID

yes

WIFI连接

连接成功?

连接成功

配置AP

用SSID连接WIFI

连接成功?

AP配网（Soft AP）
ESP32C3配置为AP模式
手机or电脑连接ESP32热点，发送WiFi和密码
ESP32设置为STA模式，连接WIFI。

手机登录页面

手机连接到"ESP32-C3-1"

配网用到的
ConfigWiFi.h

#ifndef __CONFIGWIFI_H__
#define __CONFIGWIFI_H__#include <WiFi.h>
#include <DNSServer.h>
#include <WebServer.h>
#include <ESPmDNS.h>      //用于设备域名 MDNS.begin("esp32")
#include <esp_wifi.h>     //用于esp_wifi_restore() 删除保存的wifi信息#define ROOT_HTML  "<!DOCTYPE html><html><head><title>设置WIFI</title><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"></head><style type=\"text/css\">.input{display: block; margin-top: 10px;}.input span{width: 200px; float: left; float: left; height: 36px; line-height: 36px;}.input input{height: 30px;width: 200px;}.btn{width: 150px; height: 35px; background-color: #3CBC8D; border:0px; color:#000000; margin-top:15px; }</style><body><h3>设置 WIFI</h3><form method=\"POST\" action=\"configwifi\"><table><tr><td><label class=\"input\"><span>WiFi SSID</span></label></td></tr><ty><td><label><input type=\"text\" name=\"ssid\" value=\"\"></label></td></tr><tr><td><label class=\"input\"><span>WiFi PASS</span></label></td></tr><tr><td><label> <input type=\"text\"  name=\"pass\"></label></td></tr><tr><td><label><input class=\"btn\" type=\"submit\" name=\"submit\" value=\"确  定\"></label></td></tr><tr><td> <h3> 附  近 wifi:</h3></td></tr></table></form>"#define DNS_PORT  53                    //设置DNS端口号
#define webPort   80                    //设置Web端口号
#define HOST_NAME  "MY_ESP32"           //设置设备名//==============================================
class ConfigWifi{public:ConfigWifi(  char *aAP_ssid="AutoConnectAP");// ConfigWifi( char *aAP_ssid, char *aAP_pass);void connectToWiFi(int timeOut_s);    //连接WiFivoid checkConnect(bool reConnect);    //检测wifi是否已经连接请求void restoreWiFi();                   //删除保存的wifi信息static void handleRoot();                    //处理网站根目录的访问请求static void handleConfigWifi() ;             //提交数据后的提示页面static void handleNotFound();                //处理404情况的函数'handleNotFound'void initSoftAP();                    //进入AP模式void initDNS();                       //开启DNS服务器void initWebServer();                 //初始化WebServerbool scanWiFi();                      //扫描附近的WiFi，为了显示在配网界面char* iAP_ssid  = "AutoConnectAP";    //设置AP热点名称// char* iAP_pass = "";                  //设置AP热点密码
};
#endif

ConfigWiFi.cpp

#include "ConfigWifi.h"String scanNetworksID = "";                 //用于储存扫描到的WiFi ID
String iWifi_ssid = "";                      //暂时存储wifi账号密码
String iWifi_pass = "";                      //暂时存储wifi账号密码IPAddress AP_IP(192, 168, 4, 1);             //设置AP的IP地址
DNSServer dnsServer;                        //创建dnsServer实例
WebServer server(webPort);                  //开启web服务, 创建TCP SERVER,参数: 端口号,最大连接数ConfigWifi::ConfigWifi(char *aAP_ssid){iAP_ssid = aAP_ssid;}// ConfigWifi::ConfigWifi(char *aAP_ssid,char *aAP_pass){//     iAP_ssid = aAP_ssid;
//     iAP_pass = aAP_pass;
// }void ConfigWifi::connectToWiFi(int timeOut_s){WiFi.hostname(HOST_NAME);                //设置设备名Serial.println("进入connectToWiFi()函数");WiFi.mode(WIFI_STA);                     //设置为STA模式并连接WIFIWiFi.setAutoConnect(true);               //设置自动连接    Serial.println("用nvs保存的信息连接.");WiFi.begin();                            //begin()不传入参数，默认连接上一次连接成功的wifiint Connect_time = 0;                    //用于连接计时，如果长时间连接不成功，复位设备while ((WiFi.status() != WL_CONNECTED)&(Connect_time <= 2 * timeOut_s)) {      //等待WIFI连接成功Serial.print(".");                   //一共打印30个点点delay(500);Connect_time ++;}while(WiFi.status() != WL_CONNECTED){initSoftAP();   initDNS();        initWebServer();  scanWiFi(); while(iWifi_ssid == ""){dnsServer.processNextRequest();   //检查客户端DNS请求server.handleClient();            //检查客户端(浏览器)http请求}delay(2000);WiFi.softAPdisconnect(true);     //参数设置为true，设备将直接关闭接入点模式，即关闭设备所建立的WiFi网络。server.close();                  //关闭web服务WiFi.softAPdisconnect();         //在不输入参数的情况下调用该函数,将关闭接入点模式,并将当前配置的AP热点网络名和密码设置为空值.Serial.println("WiFi Connect SSID:" + iWifi_ssid + "  PASS:" + iWifi_pass);WiFi.hostname(HOST_NAME);                     //设置设备名WiFi.mode(WIFI_STA);                          //设置为STA模式并连接WIFIWiFi.setAutoConnect(true);                    //设置自动连接    Serial.println("用web配置信息连接.");WiFi.begin(iWifi_ssid.c_str(),iWifi_pass.c_str()); //连接wifiiWifi_ssid = "";iWifi_pass = "";int Connect_time = 0;                       //用于连接计时，如果长时间连接不成功，复位设备while ((WiFi.status() != WL_CONNECTED)&(Connect_time <= 2 * timeOut_s)) {      //等待WIFI连接成功Serial.print(".");                        //一共打印30个点点delay(500);Connect_time ++;}}if (WiFi.status() == WL_CONNECTED){Serial.println("WIFI连接成功.");      }    }void ConfigWifi:: checkConnect(bool reConnect){if (WiFi.status() != WL_CONNECTED) {          //wifi连接失败if (reConnect == true && WiFi.getMode() != WIFI_AP && WiFi.getMode() != WIFI_AP_STA ) {Serial.println("WIFI未连接.");Serial.println("WiFi Mode:");Serial.println(WiFi.getMode());Serial.println("正在连接WiFi...");WiFi.begin();                   //连接wifi delay(30000);                      }if (WiFi.status() == WL_CONNECTED){Serial.println("WIFI连接成功.");      }}
}
void ConfigWifi:: restoreWiFi(){delay(500);esp_wifi_restore();  //删除保存的wifi信息Serial.println("连接信息已清空,准备重启设备..");delay(10);}void ConfigWifi::  handleRoot() {if (server.hasArg("selectSSID")) {server.send(200, "text/html", ROOT_HTML + scanNetworksID + "</body></html>");   //scanNetWprksID是扫描到的wifi} else {server.send(200, "text/html", ROOT_HTML + scanNetworksID + "</body></html>");   }}void ConfigWifi:: handleConfigWifi(){if (server.hasArg("ssid")) {          //判断是否有账号参数Serial.print("got ssid:");iWifi_ssid = server.arg("ssid");   //获取html表单输入框name名为"ssid"的内容Serial.println(iWifi_ssid);} else {                                //没有参数Serial.println("error, not found ssid");server.send(200, "text/html", "<meta charset='UTF-8'>error, not found ssid"); //返回错误页面return;}//密码与账号同理if (server.hasArg("pass")) {Serial.print("got password:");iWifi_pass = server.arg("pass");  //获取html表单输入框name名为"pwd"的内容Serial.println(iWifi_pass);} else { Serial.println("error, not found password");server.send(200, "text/html", "<meta charset='UTF-8'>error, not found password");return;}server.send(200, "text/html", "<meta charset='UTF-8'><h2>SSID：" + iWifi_ssid + "<br />password:" + iWifi_pass + "<br />已取得WiFi信息,正在尝试连接,请手动关闭此页面。</h2>"); //返回保存成功页面}void ConfigWifi:: handleNotFound(){            // 当浏览器请求的网络资源无法在服务器找到时通过此自定义函数处理handleRoot();                 //访问不存在目录则返回配置页面//   server.send(404, "text/plain", "404: Not found");
}void ConfigWifi::initSoftAP(){WiFi.mode(WIFI_AP);                                           //配置为AP模式WiFi.softAPConfig(AP_IP, AP_IP, IPAddress(255, 255, 255, 0));   //设置AP热点IP和子网掩码if (WiFi.softAP(iAP_ssid/*,iAP_pass*/))                         //开启AP热点,如需要密码则添加第二个参数{                           //打印相关信息Serial.println("ESP-32S SoftAP is right.");Serial.print("Soft-AP IP address = ");Serial.println(WiFi.softAPIP());                                                //接入点ipSerial.println(String("MAC address = ")  + WiFi.softAPmacAddress().c_str());    //接入点mac} else {                                                //开启AP热点失败Serial.println("WiFiAP Failed");delay(1000);Serial.println("restart now...");ESP.restart();                                      //重启复位esp32}}void ConfigWifi:: initDNS(){if (dnsServer.start(DNS_PORT, "*", AP_IP)) {  //判断将所有地址映射到esp32的ip上是否成功Serial.println("start dnsserver success.");} else {Serial.println("start dnsserver failed.");}}void ConfigWifi:: initWebServer(){if (MDNS.begin("esp32")) {     //给设备设定域名esp32,完整的域名是esp32.localSerial.println("MDNS responder started");}//必须添加第二个参数HTTP_GET，以下面这种格式去写，否则无法强制门户server.on("/", HTTP_GET, handleRoot);                      // 当浏览器请求服务器根目录(网站首页)时调用自定义函数handleRoot处理，设置主页回调函数，必须添加第二个参数HTTP_GET，否则无法强制门户server.on("/configwifi", HTTP_POST, handleConfigWifi);     // 当浏览器请求服务器/configwifi(表单字段)目录时调用自定义函数handleConfigWifi处理server.onNotFound(handleNotFound);                         //当浏览器请求的网络资源无法在服务器找到时调用自定义函数handleNotFound处理server.begin();                                            //启动TCP SERVERSerial.println("WebServer started!");}bool ConfigWifi:: scanWiFi(){Serial.println("scan start");Serial.println("--------->");// 扫描附近WiFiint n = WiFi.scanNetworks();Serial.println("scan done");if (n == 0) {Serial.println("no networks found");scanNetworksID = "no networks found";return false;} else {Serial.print(n);Serial.println(" networks found");for (int i = 0; i < n; ++i) {// Print SSID and RSSI for each network foundSerial.print(i + 1);Serial.print(": ");Serial.print(WiFi.SSID(i));Serial.print(" (");Serial.print(WiFi.RSSI(i));Serial.print(")");Serial.println((WiFi.encryptionType(i) == WIFI_AUTH_OPEN) ? " " : "*");scanNetworksID += "<P>" + WiFi.SSID(i) + "</P>";delay(10);}return true;}
}

示例


#include "Arduino.h"
#include "ConfigWifi.h"ConfigWifi configwifi("ESP32-C3-1");    //创建实例，AP热点名：ESP32-C3-1void setup() {// put your setup code here, to run once:Serial.begin(115200);configwifi.connectToWiFi(30);  //连接配网，30秒超时。/*调试WIFI配网时用，可删除WIFI保存的SSID和PASS，通过串口监视器操作*/// Serial.println("删除WIFI信息?:");// char temp[1];// while(temp[0] !='y' && temp[0]!='n' ){//   if (Serial.available())//   {//       temp[0] = Serial.read();//   }    // }// if( temp[0] == 'y' ){//     configwifi.restoreWiFi(); //     ESP.restart();              //重启复位esp32// }
//==================END=================================}void loop() {// put your main code here, to run repeatedly:configwifi.checkConnect(true); // 检查是否断网，断网自动连接。
}

ESP32 C3 使用ConfigWiFi配网相关推荐

ESP32 强制门户 WEB配网
修改自此博主代码参考博客参考WEB配网的网页代码 ESP32学习笔记(23)--NVS(非易失性存储)接口使用目录前言一.工程创建 1.获取源代码 2.新建一个ESP32的工程 3.移植代码 ...
ESP32 smart_config和airkiss配网
陈拓 2021/11/28-2021/11/30 1. 简介官方例程: https://gitee.com/EspressifSystems/esp-idf/tree/master/examples ...
ESP32开发--一键配网与Airkiss配网
ESP32基础系列 ESP32初体验之环境搭建 ESP32外设学习之GPIO ESP32外设学习之UART ESP32开发之给模块连上网络 ESP32的一键配网与Airkiss配网 ESP32使用NV ...
【工程师有空了】安信可ESP8266系列及ESP32系列模组AT指令实现网页配网---又多了一个配网方式
文章目录前言 AT指令介绍: 配网原理一.实验准备可能你还要用到: 二.编译固件三.开启配网四.常见问题 1.AT固件烧录不显示 "ready" 2.显示配网失败 3.除 ...
ESP32-C3入门教程 WiFi篇⑤——WiFi Smart Config 智能配网（基于AirKiss）
文章目录一.前言二.代码修改三.运行效果一.前言本文基于VS Code IDE进行编程.编译.下载.运行等操作基础入门章节请查阅:ESP32-C3入门教程基础篇①--基于VS Code构 ...
ESP32超详细学习记录：wifi配网，AP配网，浏览器配网，无线配网
不想了解代码实现,可直接到代码部分copy!ESP32亲测可用. 使用设备ESP32开发板(ESP32-WROOM-32) 搜了好多别人写的资料,很多都是copy+copy,也没有什么解释.啪,代码放 ...
验证可用的ESP32/8266配网方式，开源代码，web配网，smartconfig配网
web配网设备内做了个小web服务器通过网页交换SSID和PWD.这个方式比较友好,不依赖外部app或小程序,保密性更好,产品可用性更好(苹果等个别手机不能打开配网页面可直接浏览器登陆192.168 ...
ESP32实验-自建web服务器配网01
目标通过esp32自建web服务器实现配网.具体来说: 1.esp32上电,手机/电脑/平板连上esp32的wifi. 2.用浏览器访问esp32的网址esp32默认是192.168.4.1 3.在 ...
【MicroPython ESP32】手动配网和wifi信息保存示例
[MicroPython ESP32]手动配网和wifi信息保存示例本示例基于Thonny平台开发. 入网演示配网机制 ESP32 Micropython运行后,首先从目录下读取json配置文件信 ...

ESP32 C3 使用ConfigWiFi配网

ESP32 C3 使用ConfigWiFi配网相关推荐

最新文章

热门文章