完成上一次的基本配置后，就要开始测试APP了，先做一个能显示温湿度的小玩具吧。
启动web服务
根据文档介绍，使用ESP8266WebServer的例子写一个配置页面，用来引导用户保存配置信息到文件系统，这里我也是参考了好多资料（在第一部分中有介绍）为了界面美观又要提升读取的速度使用了Ajax的方式，html的代码就不做过多介绍了，可以看百度网盘的文件自行修改。
这里主要说一下 server.on函数是将页面指定到相应的处理函数，另外就是server.serveStatic这个函数，文档中没有具体介绍但是比起我一开始使用的 server.streamFile函数先读取文件到一个file中，然后再加载到streamFile中要好用的多了，代码简洁了也不用在定义一个file的临时变量了。
void startWebServer()
{
Serial.println("startWebServer begin");
server.on("/", handleIndex);
server.on("/saveconfig", handleSaveConfig);
server.on("/reset", handleResetChip);
server.on("/loadstate", handleLoadState);
server.serveStatic("/css", SPIFFS, "/css");
server.begin();
}
下面就是读取配置信息然后测试连接wifi并返回相应的状态，如果没有读取到配置信息或wifi连接失败，模块将启动到AP模式进行配置（默认地址为：192.168.4.1）。
void loadWifiConfig()
{
Serial.println("loadWifiConfig begin");
pinMode(D0,OUTPUT);
pinMode(D4,OUTPUT);
digitalWrite(D4, 1);
for(int l=0; l<3; l++)
{
digitalWrite(D0,0);
delay(500);
digitalWrite(D0,1);
delay(500);
}
SPIFFS.begin();
File file = SPIFFS.open(configfile,"r");
ssid = file.readStringUntil('\n');
pass = file.readStringUntil('\n');
auth = file.readStringUntil('\n');
addr = file.readStringUntil('\n');
port = file.readStringUntil('\n');
file.close();
ssid.trim();
pass.trim();
auth.trim();
addr.trim();
port.trim();
//Serial.println(ssid+","+pass+","+auth+","+addr+","+port);
if (ssid != "")
{
WiFi.disconnect();
WiFi.mode(WIFI_STA);
WiFi.begin(ssid.c_str(), pass.c_str());
for (int i = 0; i < 12; ++i)
{
Serial.println("test connect "+ (String)i);
if (WiFi.status() == WL_CONNECTED)
{
digitalWrite(D0, 0);
wifiChecked = true;
Serial.println(WiFi.localIP());
break;
}
digitalWrite(D0, 0);
delay(1000);
digitalWrite(D0, 1);
delay(1000);
}
}
if (!wifiChecked)
{
WiFi.mode(WIFI_AP);
String apssid = "ESP_" + (String)ESP.getChipId();
WiFi.softAP(apssid.c_str());
Serial.println("ap mode");
}
startWebServer();
}
以上是模块的联网配置部分由于对C语言也不是很熟，所以将上面的内容放到了一个h文件中。下面要进行Blynk的连接测试了，我把这部分放到项目的seup函数中。
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
Serial.println("setup begin");
loadWifiConfig();
//设置Blynk的端口默认值
if(port == "") port = "8080";
if(wifiChecked) {
//读取Blynk的服务器配置信息，否者将连接到blynk的默认服务器
if(addr != "") {
Blynk.config(auth.c_str(),addr.c_str(),port.toInt());
} else {
Blynk.config(auth.c_str());
}
//尝试连接Blynk服务器
for(int i = 0; i < 10; i++) {
Serial.println("*");
if(Blynk.connect()) {
//连接成功点亮ESP8266芯片的led指示灯，否则关闭led。
digitalWrite(D4,0);
blynkChecked = true;
timer.setInterval(2000, readDHT11Value);
Serial.println("blynk connected success");
return;
}
delay(1000);
}
digitalWrite(D4,1);
Serial.println("blynk connected faild");
}
}
同样在loop函数中做了一些wifi和blynk的状态检查。
void loop() {
// put your main code here, to run repeatedly:
//网页服务器响应客户端请求。
server.handleClient();
//检查wifi和blynk的连接状态。
if(Blynk.connected())
{
digitalWrite(D4,0);
Blynk.run();
timer.run();
}
else
{
Blynk.connect();
blynkChecked = false;
digitalWrite(D4,1);
}
if(WiFi.status() != WL_CONNECTED)
{
digitalWrite(D0, 0);
delay(500);
digitalWrite(D0, 1);
}
}
以上的内容有可能处理的不是很完美，希望大家优化代码后发给我。下面是配置页面，由于Blynk的自有服务器国内连接不稳定，所以自建了一个服务，感谢blynk这些开源项目（遗憾的是自建服务器不可以生成定制的app），让我们可以愉快的进行测试，有需要测试的朋友可以私聊哦。
配置页面
增加传感器模块进行测试吧
这里我只加了一个温湿度模块DHT11，简单测试一下。
//读取温湿度，并将数值写入两个虚拟引脚中。
void readDHT11Value()
{
byte h = 0;
byte t = 0;
dht11.read(D5,&t,&h,NULL);
Blynk.virtualWrite(4,(int)h);
Blynk.virtualWrite(5,(int)t);
}
安装APP吧
下面可以安装app了，安卓版可以在华为商城里面下载，也可以去墙外下载最新版。其实我第一篇的内容中所有的软件都有分享，但是被百度网盘屏蔽了，最后才发现是这个app的原因，删除后就可以分享了。不过没关系，有需要的私信我发邮箱吧。
连接blynk服务器
增加显示模块
这里说一下自建服务器的好处就是可以几乎不限量的使用能量了，每增加一个显示模块都需要相应的能量，连接blynk自有服务器的初始能量仅有2000，还是挺少的呀。
配置相应的显示信息针脚
显示效果图
好了，测试成功了，后面打算做一个wifi开关，可以远程控制并且能读取实时的功率。争取下一次写出来吧。上一张实物图吧。
实物图
最后还是分享一些资料，还是百度网盘，如果看不到就私信吧。
链接：https://pan.baidu.com/s/1s28AmfZ5EVdF_Ms9GBWRQA 密码：6xpm
感谢观看，如有错误请私信我，谢谢。
网友评论