1:建立基本网络服务器
我们的ESP866-NodeMCU虽然也能实现网络服务器的一些功能,但是毕竟它的运算能力是无法与那些昂贵的服务器电脑相媲美的,因此ESP8266-NodeMCU只能实现一些基本的网络服务功能。网络服务是一个很宽泛的概念,我们在这里即将给您介绍的是网络服务中的网页服务功能。所谓网页服务就是专门用于网页浏览的服务。
过程。首先,要想访问太极创客网站就要在浏览器地址栏输入太极创客的网站地址: www.taichi-maker.com。当您输入完地址并按下回车以后,浏览器会通过DNS服务查到太极创客网站服务器的IP地址。假设我们太极创客服务器地址为12.34.56.78。接下来浏览器就会向IP地址12.34.56.78的服务器发送http请求。当网站服务器收到了请求后,会把被请求的网页信息传输给浏览器,然后浏览器就会把收到的网页信息转换成网页显示在浏览器中。
/**********************************************************************
项目名称/Project : 零基础入门学用物联网
程序名称/Program name : 3_2_1_First_Web_Server
团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com)
作者/Author : CYNO朔
日期/Date(YYYYMMDD) : 20191107
程序目的/Purpose : 使用NodeMCU建立基本服务器。用户可通过浏览器使用8266的IP地址访问8266所建立的基本网页(Hello from ESP8266)
-----------------------------------------------------------------------
修订历史/Revision History
日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description***********************************************************************/
#include <ESP8266WiFi.h> // 本程序使用 ESP8266WiFi库
#include <ESP8266WiFiMulti.h> // ESP8266WiFiMulti库
#include <ESP8266WebServer.h> // ESP8266WebServer库ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是'wifiMulti'ESP8266WebServer esp8266_server(80);// 建立ESP8266WebServer对象,对象名称为esp8266_server// 括号中的数字是网路服务器响应http请求的端口号// 网络服务器标准http端口号为80,因此这里使用80为端口号void setup(void){Serial.begin(9600); // 启动串口通讯//通过addAp函数存储 WiFi名称 WiFi密码wifiMulti.addAP("taichi-maker", "12345678"); // 这三条语句通过调用函数addAP来记录3个不同的WiFi网络信息。wifiMulti.addAP("taichi-maker2", "87654321"); // 这3个WiFi网络名称分别是taichi-maker, taichi-maker2, taichi-maker3。wifiMulti.addAP("taichi-maker3", "13572468"); // 这3个网络的密码分别是123456789,87654321,13572468。// 此处WiFi信息只是示例,请在使用时将需要连接的WiFi信息填入相应位置。// 另外这里只存储了3个WiFi信息,您可以存储更多的WiFi信息在此处。int i = 0; while (wifiMulti.run() != WL_CONNECTED) { // 此处的wifiMulti.run()是重点。通过wifiMulti.run(),NodeMCU将会在当前delay(1000); // 环境中搜索addAP函数所存储的WiFi。如果搜到多个存储的WiFi那么NodeMCUSerial.print(i++); Serial.print(' '); // 将会连接信号最强的那一个WiFi信号。} // 一旦连接WiFI成功,wifiMulti.run()将会返回“WL_CONNECTED”。这也是// 此处while循环判断是否跳出循环的条件。// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n'); // WiFi连接成功后Serial.print("Connected to "); // NodeMCU将通过串口监视器输出。Serial.println(WiFi.SSID()); // 连接的WiFI名称Serial.print("IP address:\t"); // 以及Serial.println(WiFi.localIP()); // NodeMCU的IP地址//--------"启动网络服务功能"程序部分开始-------- // 此部分为程序为本示例程序重点1esp8266_server.begin(); // 详细讲解请参见太极创客网站《零基础入门学用物联网》esp8266_server.on("/", handleRoot); // 第3章-第2节 ESP8266-NodeMCU网络服务器-1esp8266_server.onNotFound(handleNotFound);
//--------"启动网络服务功能"程序部分结束--------Serial.println("HTTP esp8266_server started");// 告知用户ESP8266网络服务功能已经启动
}/* 以下函数语句为本示例程序重点3
详细讲解请参见太极创客网站《零基础入门学用物联网》
第3章-第2节 3_2_1_First_Web_Server 的说明讲解*/
void loop(void){esp8266_server.handleClient(); // 处理http服务器访问
}/* 以下两个函数为本示例程序重点2
详细讲解请参见太极创客网站《零基础入门学用物联网》
第3章-第2节 3_2_1_First_Web_Server 的说明讲解*/
void handleRoot() { //处理网站根目录“/”的访问请求 esp8266_server.send(200, "text/plain", "Hello from ESP8266"); // NodeMCU将调用此函数。
}// 设置处理404情况的函数'handleNotFound'
void handleNotFound(){ // 当浏览器请求的网络资源无法在服务器找到时,esp8266_server.send(404, "text/plain", "404: Not found"); // NodeMCU将调用此函数。
}
- esp8266_server.begin();
- esp8266_server.on("/", handleRoot);
- esp8266_server.onNotFound(handleNotFound);
程序第一句
esp8266_server.begin()
使用了ESP8266WebServer库中的begin
函数。这个函数的作用是让ESP8266-NodeMCU来启动网络服务功能。该函数无需任何参数。接下来的的语句
esp8266_server.on("/", handleRoot)
相对复杂一些。这条语句调用了ESP8266WebServer库中的on
函数,该函数的作用是指挥NodeMCU来如何处理浏览器的http请求。我们看到on
函数一共有两个参数,第一个参数是字符串”/”,第二个参数是一个函数的名称handleRoot。这个handleRoot函数的具体内容,我后面会给您做详细讲解。现在请您留意on
函数有两个参数,一个是字符串”/”,另一个是函数名handleRoot。
2: 通过网络服务实现NodeMCU开发板基本控制
利用NodeMCU建立网络服务。用户通过浏览器可以访问NodeMCU所建立的网页。通过该网页,用户可实现对NodeMCU的控制。
/**********************************************************************
项目名称/Project : 零基础入门学用物联网
程序名称/Program name : 3_2_2_Turning_on_and_off_an_LED
团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com)
作者/Author : CYNO朔
日期/Date(YYYYMMDD) : 20191108
程序目的/Purpose : 使用NodeMCU建立基本服务器。用户可通过浏览器使用8266的IP地址访问8266所建立的基本网页并通过该页面点亮/熄灭NodeMCU的内置LED
-----------------------------------------------------------------------
修订历史/Revision History
日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description***********************************************************************/
#include <ESP8266WiFi.h> // 本程序使用 ESP8266WiFi库
#include <ESP8266WiFiMulti.h> // ESP8266WiFiMulti库
#include <ESP8266WebServer.h> // ESP8266WebServer库ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是 'wifiMulti'ESP8266WebServer esp8266_server(80);// 建立网络服务器对象,该对象用于响应HTTP请求。监听端口(80)void setup(void){Serial.begin(9600); // 启动串口通讯pinMode(LED_BUILTIN, OUTPUT); //设置内置LED引脚为输出模式以便控制LEDwifiMulti.addAP("ssid_from_AP_1", "your_password_for_AP_1"); // 将需要连接的一系列WiFi ID和密码输入这里wifiMulti.addAP("ssid_from_AP_2", "your_password_for_AP_2"); // ESP8266-NodeMCU再启动后会扫描当前网络wifiMulti.addAP("ssid_from_AP_3", "your_password_for_AP_3"); // 环境查找是否有这里列出的WiFi ID。如果有Serial.println("Connecting ..."); // 则尝试使用此处存储的密码进行连接。int i = 0; while (wifiMulti.run() != WL_CONNECTED) { // 此处的wifiMulti.run()是重点。通过wifiMulti.run(),NodeMCU将会在当前delay(1000); // 环境中搜索addAP函数所存储的WiFi。如果搜到多个存储的WiFi那么NodeMCUSerial.print(i++); Serial.print(' '); // 将会连接信号最强的那一个WiFi信号。} // 一旦连接WiFI成功,wifiMulti.run()将会返回“WL_CONNECTED”。这也是// 此处while循环判断是否跳出循环的条件。// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n');Serial.print("Connected to ");Serial.println(WiFi.SSID()); // 通过串口监视器输出连接的WiFi名称Serial.print("IP address:\t");Serial.println(WiFi.localIP()); // 通过串口监视器输出ESP8266-NodeMCU的IPesp8266_server.begin(); // 启动网站服务esp8266_server.on("/", HTTP_GET, handleRoot); // 设置服务器根目录即'/'的函数'handleRoot'esp8266_server.on("/LED", HTTP_POST, handleLED); // 设置处理LED控制请求的函数'handleLED'esp8266_server.onNotFound(handleNotFound); // 设置处理404情况的函数'handleNotFound'Serial.println("HTTP esp8266_server started");// 告知用户ESP8266网络服务功能已经启动
}void loop(void){esp8266_server.handleClient(); // 检查http服务器访问
}/*设置服务器根目录即'/'的函数'handleRoot'该函数的作用是每当有客户端访问NodeMCU服务器根目录时,NodeMCU都会向访问设备发送 HTTP 状态 200 (Ok) 这是send函数的第一个参数。同时NodeMCU还会向浏览器发送HTML代码,以下示例中send函数中第三个参数,也就是双引号中的内容就是NodeMCU发送的HTML代码。该代码可在网页中产生LED控制按钮。 当用户按下按钮时,浏览器将会向NodeMCU的/LED页面发送HTTP请求,请求方式为POST。NodeMCU接收到此请求后将会执行handleLED函数内容*/
void handleRoot() { esp8266_server.send(200, "text/html", "<form action=\"/LED\" method=\"POST\"><input type=\"submit\" value=\"Toggle LED\"></form>");
}//处理LED控制请求的函数'handleLED'
void handleLED() { digitalWrite(LED_BUILTIN,!digitalRead(LED_BUILTIN));// 改变LED的点亮或者熄灭状态esp8266_server.sendHeader("Location","/"); // 跳转回页面根目录esp8266_server.send(303); // 发送Http相应代码303 跳转
}// 设置处理404情况的函数'handleNotFound'
void handleNotFound(){esp8266_server.send(404, "text/plain", "404: Not found"); // 发送 HTTP 状态 404 (未找到页面) 并向浏览器发送文字 "404: Not found"
}
3:通过网络服务将开发板引脚状态显示在网页中
我们可以通过NodeMCU开发板上的FLASH按键控制D3引脚的电平。当我们没有按下该按键时,D3引脚将会保持高电平状态。当按下该按键后,D3引脚会变为低电平。
/**********************************************************************
项目名称/Project : 零基础入门学用物联网
程序名称/Program name : 3_2_3_Pin_State_Display
团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com)
作者/Author : CYNO朔
日期/Date(YYYYMMDD) : 20191107
程序目的/Purpose : 使用NodeMCU建立基本服务器。该页面将会自动刷新并且显示NodeMCU的D3引脚状态。NodeMCU开发板上的FLASH按键可以控制D3引脚的电平。没有按下该按键时D3引脚将会保持高电平状态。当按下该按键后,D3引脚会变为低电平。
-----------------------------------------------------------------------
修订历史/Revision History
日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description
***********************************************************************/#include <ESP8266WiFi.h> // 本程序使用 ESP8266WiFi库
#include <ESP8266WiFiMulti.h> // ESP8266WiFiMulti库
#include <ESP8266WebServer.h> // ESP8266WebServer库#define buttonPin D3 // 按钮引脚D3ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是'wifiMulti'ESP8266WebServer esp8266_server(80);// 建立网络服务器对象,该对象用于响应HTTP请求。监听端口(80)bool pinState; // 存储引脚状态用变量void setup(){Serial.begin(9600); // 启动串口通讯pinMode(buttonPin, INPUT_PULLUP); // 将按键引脚设置为输入上拉模式wifiMulti.addAP("TP-LINK_7163", "888999..gzb"); // 将需要连接的一系列WiFi ID和密码输入这里wifiMulti.addAP("ssid_from_AP_2", "your_password_for_AP_2"); // ESP8266-NodeMCU再启动后会扫描当前网络wifiMulti.addAP("ssid_from_AP_3", "your_password_for_AP_3"); // 环境查找是否有这里列出的WiFi ID。如果有Serial.println("Connecting ..."); // 则尝试使用此处存储的密码进行连接。int i = 0; while (wifiMulti.run() != WL_CONNECTED) { // 此处的wifiMulti.run()是重点。通过wifiMulti.run(),NodeMCU将会在当前delay(1000); // 环境中搜索addAP函数所存储的WiFi。如果搜到多个存储的WiFi那么NodeMCUSerial.print(i++); Serial.print(' '); // 将会连接信号最强的那一个WiFi信号。} // 一旦连接WiFI成功,wifiMulti.run()将会返回“WL_CONNECTED”。这也是// 此处while循环判断是否跳出循环的条件。// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n'); // WiFi连接成功后Serial.print("Connected to "); // NodeMCU将通过串口监视器输出。Serial.println(WiFi.SSID()); // 连接的WiFI名称Serial.print("IP address:\t"); // 以及Serial.println(WiFi.localIP()); // NodeMCU的IP地址esp8266_server.begin(); // 启动网站服务 esp8266_server.on("/", handleRoot); // 设置服务器根目录即'/'的函数'handleRoot'esp8266_server.onNotFound(handleNotFound);// 设置处理404情况的函数'handleNotFound' Serial.println("HTTP esp8266_server started");// 告知用户ESP8266网络服务功能已经启动
}void loop(){esp8266_server.handleClient(); // 处理http服务器访问pinState = digitalRead(buttonPin); // 获取引脚状态
}/* 以下函数处理网站首页的访问请求。此函数为本示例程序重点1
详细讲解请参见太极创客网站《零基础入门学用物联网》
第3章-第2节“通过网络服务将开发板引脚状态显示在网页中”的说明讲解。*/
void handleRoot() { String displayPinState; // 存储按键状态的字符串变量if(pinState == HIGH){ // 当按键引脚D3为高电平displayPinState = "Button State: HIGH"; // 字符串赋值高电平信息} else { // 当按键引脚D3为低电平displayPinState = "Button State: LOW"; // 字符串赋值低电平信息}esp8266_server.send(200, "text/plain", displayPinState); // 向浏览器发送按键状态信息
}// 设置处理404情况的函数'handleNotFound'
void handleNotFound(){ // 当浏览器请求的网络资源无法在服务器找到时,esp8266_server.send(404, "text/plain", "404: Not found"); // NodeMCU将调用此函数。
}
以上程序的loop函数中,
pinState = digitalRead(buttonPin);
语句将不断检查NodeMCU开发板D3引脚状态,也就是检查该引脚所连接的按键是否被按下。该状态将会存储与布尔变量pinState中。变量pinState将会用于本程序的重点1,也就是handleRoot() 函数里。在handleRoot函数里,我们利用逻辑判断语句来对displayPinState 进行赋值。如果按键没有被按下,pinState为HIGH,这时候程序将会执行
displayPinState = "Button State: HIGH";
也就是为displayPinState的赋值为“Button State: HIGH”。这句话的意思是“按键引脚状态为高电平”。反之,当我们按下按键后,程序将会执行displayPinState = "Button State: LOW";
也就是为displayPinState的赋值为“Button State: LOW”。在handleRoot函数的结尾处,
esp8266_server.send(200, "text/plain", displayPinState);
这条语句将会把displayPinState所存储的信息发送给浏览器。于是我们在没有按下按键时,将会得到以下页面信息。
自动刷新页面:
/**********************************************************************
项目名称/Project : 零基础入门学用物联网
程序名称/Program name : 3_2_4_Pin_State_Display_Auto_Refresh
团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com)
作者/Author : CYNO朔
日期/Date(YYYYMMDD) : 20200128
程序目的/Purpose : 使用NodeMCU建立基本服务器。该网页将显示引脚D3状态。同时状态会每隔5秒钟更新一次。
-----------------------------------------------------------------------
修订历史/Revision History
日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description***********************************************************************/#include <ESP8266WiFi.h> // 本程序使用 ESP8266WiFi库
#include <ESP8266WiFiMulti.h> // ESP8266WiFiMulti库
#include <ESP8266WebServer.h> // ESP8266WebServer库#define buttonPin D3 // 按钮引脚D3ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是'wifiMulti'ESP8266WebServer esp8266_server(80);// 建立网络服务器对象,该对象用于响应HTTP请求。监听端口(80)bool pinState; // 存储引脚状态用变量void setup(){Serial.begin(9600); // 启动串口通讯delay(10);Serial.println("");pinMode(buttonPin, INPUT_PULLUP); // 将按键引脚设置为输入上拉模式wifiMulti.addAP("TP-LINK_7163", "888999..gzb"); // 将需要连接的一系列WiFi ID和密码输入这里wifiMulti.addAP("ssid_from_AP_2", "your_password_for_AP_2"); // ESP8266-NodeMCU在启动后会扫描当前网络wifiMulti.addAP("ssid_from_AP_3", "your_password_for_AP_3"); // 环境查找是否有这里列出的WiFi ID。如果有Serial.println("Connecting ..."); // 则尝试使用此处存储的密码进行连接。// 另外这里只存储了3个WiFi信息,您可以存储更多// 的WiFi信息在此处。int i = 0; while (wifiMulti.run() != WL_CONNECTED) { // 此处的wifiMulti.run()是重点。通过wifiMulti.run(),NodeMCU将会在当前delay(1000); // 环境中搜索addAP函数所存储的WiFi。如果搜到多个存储的WiFi那么NodeMCUSerial.print(i++); Serial.print(' '); // 将会连接信号最强的那一个WiFi信号。} // 一旦连接WiFI成功,wifiMulti.run()将会返回“WL_CONNECTED”。这也是// 此处while循环判断是否跳出循环的条件。// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n'); // WiFi连接成功后Serial.print("Connected to "); // NodeMCU将通过串口监视器输出。Serial.println(WiFi.SSID()); // 连接的WiFI名称Serial.print("IP address:\t"); // 以及Serial.println(WiFi.localIP()); // NodeMCU的IP地址esp8266_server.begin(); esp8266_server.on("/", handleRoot); esp8266_server.onNotFound(handleNotFound); Serial.println("HTTP esp8266_server started");// 告知用户ESP8266网络服务功能已经启动
}void loop(){esp8266_server.handleClient(); // 处理http服务器访问pinState = digitalRead(buttonPin); // 获取引脚状态
} /* 以下函数处理网站首页的访问请求。此函数为本示例程序重点1
详细讲解请参见太极创客网站《零基础入门学用物联网》
第3章-第2节“通过网络服务将开发板引脚状态显示在网页中”的说明讲解。*/
void handleRoot() { //处理网站目录“/”的访问请求 esp8266_server.send(200, "text/html", sendHTML(pinState));
}/*
建立用于发送给客户端浏览器的HTML代码。此代码将会每隔5秒刷新页面。
通过页面刷新,引脚的最新状态也会显示于页面中
*/
String sendHTML(bool buttonState){String htmlCode = "<!DOCTYPE html> <html>\n";htmlCode +="<head><meta http-equiv='refresh' content='5'/>\n";htmlCode +="<title>ESP8266 Butoon State</title>\n";htmlCode +="<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}\n";htmlCode +="body{margin-top: 50px;} h1 {color: #444444;margin: 50px auto 30px;} h3 {color: #444444;margin-bottom: 50px;}\n";htmlCode +="</style>\n";htmlCode +="</head>\n";htmlCode +="<body>\n";htmlCode +="<h1>ESP8266 BUTTON STATE</h1>\n";if(buttonState){htmlCode +="<p>Button Status: HIGH</p>\n";}else{htmlCode +="<p>Button Status: LOW</p>\n";}htmlCode +="</body>\n";htmlCode +="</html>\n";return htmlCode;
}// 设置处理404情况的函数'handleNotFound'
void handleNotFound(){ // 当浏览器请求的网络资源无法在服务器找到时,esp8266_server.send(404, "text/plain", "404: Not found"); // NodeMCU将调用此函数。
}
在以上示例程序中的
handleRoot
函数中,esp8266_server.send(200, "text/html", sendHTML(pinState))
语句的的3个参数sendHTML(pinState)
调用了sendHTML
函数。该函数的作用是建立一个可以定时刷新的HTML网页代码。通过定时刷新网页,开发板的引脚状态将会不断地在页面中进行更新。此HTML网页代码是由
sendHTML
函数产生的。该函数建立了一个字符串变量,该字符串变量所存储的信息正是网页HTML代码。值得注意的是,该HTML代码会不断地检查变量pinState状态,并且根据pinState的状态改变HTML代码的信息,从而实现在网页上显示引脚状态。此HTML代码中真正实现定时刷新网页功能的语句是代码中的第79行语句。这条语句是告诉网页需要定时刷新,刷新频率5秒钟,即每5秒钟刷新一次页面。您可以通过改变此行语句中的数值5来调整页面刷新频率。
每一次页面刷新,浏览器都会向NodeMCU发送HTTP请求。NodeMCU在收到浏览器请求后,将会把最新的HTML代码信息返回给浏览器。浏览器收到最新的HTML代码后将会在页面中显示引脚的状态。
以下是没有按下按键时的页面显示信息。