8266教程：项目实战1：利用闪存和WEBsever实现网页配网

最新推荐文章于 2024-05-02 20:55:13 发布

小薛1988

最新推荐文章于 2024-05-02 20:55:13 发布

阅读量759

点赞数

分类专栏： 8266

原文链接：https://blog.csdn.net/weixin_42880082/article/details/113802156?utm_medium=distribute.pc_relevant_download.none-task-blog-2~default~BlogCommendFromBaidu~default-14.test_version_3&depth_1-utm_source=distribute.pc_relevant_download.none-task-blog-2~default~

版权

8266 专栏收录该内容

12 篇文章 3 订阅

订阅专栏

简单ESP8266Web配网，利用闪存文件系统记录配网信息和相关参数设置

简单的ESP8266Web配网，利用闪存文件系统记录配网信息。

主要功能是通过WEB配置相关的信息，除了配置wifi外还可以配置其他相关参数信息提供了便捷方法，与利用eeprom保存原理上都是相同的，避免相关信息写死在程序里面，方便程序后期维护，相关参数可以通过配网页面给定。
存储配置参数的核心代码，就是利用json返回的数据保存下来，下次重启，先访问config.json，是否有参数，没有就进入配网页面。

 String payload; // 拼接构造一段字符串形式的json数据长{"ssid":"xxxxx","password":"xxxxxxxxxxx"}
  payload += "{\"ssid\":\"";
  payload += ssid;
  payload += "\",\"password\":\"";
  payload += password;
  payload += "\",\"location0\":\"";
  payload += location0;
  payload += "\",\"apikey0\":\"";
  payload += apikey0;
  payload += "\"}";
  File wifiConfig = SPIFFS.open("/config.json", "w");
  wifiConfig.println(payload);//将数据写入config.json文件中

  
  
  
  注意事项：利用闪存文件系统配置，上传完程序后，再点击工具-esp8266 Sketch Date Upload上传配置后，才可以打开相关的Web配置页面，进行配置,优点是：除了可以配置wifi信息，还可以配置其他参数信息进去，便于程序后期维护。
 本实例所运用到的库： 

   
   #include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FS.h> //闪存文件系统
#include <ArduinoJson.h>//json数据处理库（第三方）

    
    
    
     

   
   主程序： 

   
   #include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FS.h> //闪存文件系统
#include <ArduinoJson.h>//json数据处理库（第三方）

ESP8266WebServer server(80); //创建Web服务端口为80

void setup() {
pinMode(LED_BUILTIN, INPUT_PULLUP);//板子上的FLASH按键，
Serial.begin(115200);
Serial.println("");
if (SPIFFS.begin()) { // 打开闪存文件系统，记得在你连接板子下载的过程中选Flash Size的时候不要选no SPIFFS,你可以选1M、2M、3M都无所谓，因为两个文件都很小
Serial.println(“闪存文件系统打开成功”);
} else {
Serial.println(“闪存文件系统打开失败”);
}
if (SPIFFS.exists("/config.json")) { // 判断有没有config.json这个文件
Serial.println(“存在配置信息，正在自动连接”);
const size_t capacity = JSON_OBJECT_SIZE(1) + JSON_OBJECT_SIZE(2) + 60; //分配一个内存空间
DynamicJsonDocument doc(capacity);// 声明json处理对象
File configJson = SPIFFS.open("/config.json", “r”);
deserializeJson(doc, configJson); // json数据序列化
const char ssid = doc[“ssid”];
const char password = doc[“password”];
const char laction0 = doc[“laction”];
const char apikey0 = doc[“apikey”];
WiFi.mode(WIFI_STA); // 更换wifi模式
// WiFi.mode(WIFI_AP_STA);//设置模式为AP+STA
digitalWrite(LED_BUILTIN, LOW);

WiFi<span class="token punctuation">.</span><span class="token function">begin</span><span class="token punctuation">(</span>ssid<span class="token punctuation">,</span> password<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 连接wifi</span>
Serial<span class="token punctuation">.</span><span class="token function">println</span><span class="token punctuation">(</span><span class="token string">"AP设置完成"</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">while</span> <span class="token punctuation">(</span>WiFi<span class="token punctuation">.</span><span class="token function">status</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">!=</span> WL_CONNECTED<span class="token punctuation">)</span> <span class="token punctuation">{<!-- --></span>
  <span class="token function">delay</span><span class="token punctuation">(</span><span class="token number">500</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  Serial<span class="token punctuation">.</span><span class="token function">print</span><span class="token punctuation">(</span><span class="token string">"."</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
configJson<span class="token punctuation">.</span><span class="token function">close</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
Serial<span class="token punctuation">.</span><span class="token function">println</span><span class="token punctuation">(</span>WiFi<span class="token punctuation">.</span><span class="token function">localIP</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

} else {
Serial.println(“不存在配置信息，正在打开web配网模式”);
IPAddress softLocal(192,168,1,1);
IPAddress softGateway(192,168,1,1);
IPAddress softSubnet(255,255,255,0);
WiFi.softAPConfig(softLocal, softGateway, softSubnet);
WiFi.softAP(“esp8266”, “12345678”); //这里是配网模式下热点的名字和密码
Serial.println(WiFi.softAPIP());
}
server.on("/", handleRoot);//web首页监听
server.on("/set", handleConnect); // 配置ssid密码监听，感觉跟express的路由好像
server.begin();
}

void loop() {
server.handleClient();
// if (digitalRead(LED_BUILTIN) == 0) { //按键扫描
// removeConfig();
//}
}

void handleRoot() { //展示网页的关键代码
if (SPIFFS.exists("/index.html")) {
File index = SPIFFS.open("/index.html", “r”);
server.streamFile(index, “text/html”);
index.close();
}
}

void handleConnect() { //处理配置信息的函数
String ssid = server.arg(“ssid”); //arg是获取请求参数，视频中最后面展示了请求的完整链接
String password = server.arg(“password”);
String laction0 = server.arg(“location”); //从JavaScript发送的数据中找laction的值
String apikey0 = server.arg(“apikey”); //从JavaScript发送的数据中找apikey的值
Serial.println(ssid);
Serial.println(password);
Serial.println(laction0);
Serial.println(apikey0);
server.send(300, “text/plain”, “OK”);
WiFi.mode(WIFI_STA); //改变wifi模式
WiFi.begin(ssid.c_str(), password.c_str());//String类型直接用会报错，不要问为什么，转成char *就行了。
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println(WiFi.localIP());
removeConfig(); // 不管有没有配置先删除一次再说。
String payload; // 拼接构造一段字符串形式的json数据长{“ssid”:“xxxxx”,“password”:“xxxxxxxxxxx”}
payload += “{“ssid”:”";
payload += ssid;
payload += “”,“password”:"";
payload += password;
payload += “”,“location0”:"";
payload += location0;
payload += “”,“apikey0”:"";
payload += apikey0;
payload += “”}";
File wifiConfig = SPIFFS.open("/config.json", “w”);
wifiConfig.println(payload);//将数据写入config.json文件中
wifiConfig.close();
}

void removeConfig() {
if (SPIFFS.exists("/config.json")) { // 判断有没有config.json这个文件
if (SPIFFS.remove("/config.json")) {
Serial.println(“删除旧配置”);
} else {
Serial.println(“删除旧配置失败”);
}
}
}

</style>
</html>

配置页面如下：

重启参数不丢失。

小薛1988

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
1
评论
8266教程：项目实战1：利用闪存和WEBsever实现网页配网

简单ESP8266Web配网，利用闪存文件系统记录配网信息和相关参数设置简单的ESP8266Web配网，利用闪存文件系统记录配网信息。主要功能是通过WEB配置相关的信息，除了配置wifi外还可以配置其他相关参数信息提供了便捷方法，与利用eeprom保存原理上都是相同的，避免相关信息写死在程序里面，方便程序后期维护...
复制链接

扫一扫