闪存剩下内容
1：通过Arduino IDE向闪存文件系统上传文件
1. 下载 Arduino-ESP8266闪存文件插件程序
2：使用闪存文件系统建立功能更加丰富的网络服务器
1：在网页中加载闪存文件系统中的图片、CSS和JavaScript
- index.html：ESP8266开发板建立的网站首页
- main.css：控制网页的css(层叠样式表)
- JavaScript.js和clock.js：在页面中显示日期和时钟的JavaScript文件。这两个程序主要用于演示如何在ESP8266开发板所建立的物联网页面中显示JavaScript
- img目录中的图片taichi-maker.jpg:此图片用于演示如何在ESP8266开发板所建立的物联网页面中显示图片
-
/********************************************************************** 项目名称/Project : 零基础入门学用物联网 程序名称/Program name : 3_4_1_SPIFFS_File_server 团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com) 作者/Author : CYNO朔 日期/Date（YYYYMMDD） : 20191109 程序目的/Purpose : 当用户访问NodeMCU地址时，NodeMCU将会检查访问地址是否指向SPIFFS系统中的文件，并且 将该文件显示于用户的浏览器中。如果访问地址所指向的文件无法在SPIFFS中找到，NodeMCU将会 向用户发送404信息。 ----------------------------------------------------------------------- 修订历史/Revision History 日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description 20200211 CYNO朔 0.01 修改了handleNotFound函数使其更直观 ----------------------------------------------------------------------- 本示例程序为太极创客团队制作的《零基础入门学用物联网》中示例程序。 该教程为对物联网开发感兴趣的朋友所设计和制作。如需了解更多该教程的信息，请参考以下网页： http://www.taichi-maker.com/homepage/esp8266-nodemcu-iot/ ***********************************************************************/#include <ESP8266WiFi.h> #include <ESP8266WiFiMulti.h> #include <ESP8266WebServer.h> #include <FS.h> ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象ESP8266WebServer esp8266_server(80); // 建立网络服务器对象，该对象用于响应HTTP请求。监听端口（80）void setup() {Serial.begin(9600); // 启动串口通讯Serial.println("");wifiMulti.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) { // 尝试进行wifi连接。delay(1000);Serial.print(i++); Serial.print(' ');}// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n');Serial.print("Connected to ");Serial.println(WiFi.SSID()); // 通过串口监视器输出连接的WiFi名称Serial.print("IP address:\t");Serial.println(WiFi.localIP()); // 通过串口监视器输出ESP8266-NodeMCU的IPif(SPIFFS.begin()){ // 启动闪存文件系统Serial.println("SPIFFS Started.");} else {Serial.println("SPIFFS Failed to Start.");}esp8266_server.onNotFound(handleUserRequet); // 告知系统如何处理用户请求esp8266_server.begin(); // 启动网站服务Serial.println("HTTP server started"); }void loop(void) {esp8266_server.handleClient(); // 处理用户请求 }// 处理用户浏览器的HTTP访问 void handleUserRequet() { // 获取用户请求网址信息String webAddress = esp8266_server.uri();// 通过handleFileRead函数处处理用户访问bool fileReadOK = handleFileRead(webAddress);// 如果在SPIFFS无法找到用户访问的资源，则回复404 (Not Found)if (!fileReadOK){ esp8266_server.send(404, "text/plain", "404 Not Found"); } }bool handleFileRead(String path) { //处理浏览器HTTP访问if (path.endsWith("/")) { // 如果访问地址以"/"为结尾path = "/index.html"; // 则将访问地址修改为/index.html便于SPIFFS访问} String contentType = getContentType(path); // 获取文件类型if (SPIFFS.exists(path)) { // 如果访问的文件可以在SPIFFS中找到File file = SPIFFS.open(path, "r"); // 则尝试打开该文件esp8266_server.streamFile(file, contentType);// 并且将该文件返回给浏览器file.close(); // 并且关闭文件return true; // 返回true}return false; // 如果文件未找到，则返回false }// 获取文件类型 String getContentType(String filename){if(filename.endsWith(".htm")) return "text/html";else if(filename.endsWith(".html")) return "text/html";else if(filename.endsWith(".css")) return "text/css";else if(filename.endsWith(".js")) return "application/javascript";else if(filename.endsWith(".png")) return "image/png";else if(filename.endsWith(".gif")) return "image/gif";else if(filename.endsWith(".jpg")) return "image/jpeg";else if(filename.endsWith(".ico")) return "image/x-icon";else if(filename.endsWith(".xml")) return "text/xml";else if(filename.endsWith(".pdf")) return "application/x-pdf";else if(filename.endsWith(".zip")) return "application/x-zip";else if(filename.endsWith(".gz")) return "application/x-gzip";return "text/plain"; }
-
2：通过网页控制ESP8266开发板的引脚
-
/********************************************************************** 项目名称/Project : 零基础入门学用物联网 程序名称/Program name : 3_4_2_SPIFFS_Pin_Control_Server 团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com) 作者/Author : CYNO朔 日期/Date（YYYYMMDD） : 20191109 程序目的/Purpose : 使用ESP8266-NodeMCU建立一个有多个页面的网站。在LED页面中配有可控制LED点亮和熄灭的 按钮。点击首页的LED Page链接进入LED页。点击LED页按钮将控制NodeMCU的内置LED点亮和熄灭。----------------------------------------------------------------------- 修订历史/Revision History 日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description 20200211 CYNO朔 0.01 修改了handleNotFound函数使其更直观 20200217 CYNO朔 0.02 一致性调整 ----------------------------------------------------------------------- 本示例程序为太极创客团队制作的《零基础入门学用物联网》中示例程序。 该教程为对物联网开发感兴趣的朋友所设计和制作。如需了解更多该教程的信息，请参考以下网页： http://www.taichi-maker.com/homepage/esp8266-nodemcu-iot/ ***********************************************************************/#include <ESP8266WiFi.h> // 本程序使用ESP8266WiFi库 #include <ESP8266WiFiMulti.h> // 本程序使用ESP8266WiFiMulti库 #include <ESP8266WebServer.h> // 本程序使用ESP8266WebServer库 #include <FS.h> // 本程序使用SPIFFS库ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是'wifiMulti'ESP8266WebServer esp8266_server(80); // 建立网络服务器对象，该对象用于响应HTTP请求。监听端口（80）void setup(){Serial.begin(9600); Serial.println("");pinMode(LED_BUILTIN, OUTPUT); // 初始化NodeMCU控制板载LED引脚为OUTPUT//通过addAp函数存储 WiFi名称 WiFi密码wifiMulti.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) { // 在当前环境中搜索addAP函数所存储的WiFidelay(1000); // 如果搜到多个存储的WiFi那么NodeMCUSerial.print(i++); Serial.print('.'); // 将会连接信号最强的那一个WiFi信号。} // 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地址if(SPIFFS.begin()){ // 启动闪存文件系统Serial.println("SPIFFS Started.");} else {Serial.println("SPIFFS Failed to Start.");}esp8266_server.on("/LED-Control", handleLEDControl); // 告知系统如何处理/LED-Control请求 esp8266_server.onNotFound(handleUserRequest); // 告知系统如何处理其它用户请求 esp8266_server.begin(); // 启动网站服务 Serial.println("HTTP server started"); }void loop(){esp8266_server.handleClient(); //处理用户请求 } // 处理/LED-Control请求 void handleLEDControl(){bool ledStatus = digitalRead(LED_BUILTIN); // 此变量用于储存LED状态 ledStatus == HIGH ? digitalWrite(LED_BUILTIN, LOW) : digitalWrite(LED_BUILTIN, HIGH); // 点亮或者熄灭LED esp8266_server.sendHeader("Location", "/LED.html"); esp8266_server.send(303); }// 处理用户浏览器的HTTP访问 void handleUserRequest() { // 获取用户请求资源(Request Resource）String reqResource = esp8266_server.uri();Serial.print("reqResource: ");Serial.println(reqResource);// 通过handleFileRead函数处处理用户请求资源bool fileReadOK = handleFileRead(reqResource);// 如果在SPIFFS无法找到用户访问的资源，则回复404 (Not Found)if (!fileReadOK){ esp8266_server.send(404, "text/plain", "404 Not Found"); } }bool handleFileRead(String resource) { //处理浏览器HTTP访问if (resource.endsWith("/")) { // 如果访问地址以"/"为结尾resource = "/index.html"; // 则将访问地址修改为/index.html便于SPIFFS访问} String contentType = getContentType(resource); // 获取文件类型if (SPIFFS.exists(resource)) { // 如果访问的文件可以在SPIFFS中找到File file = SPIFFS.open(resource, "r"); // 则尝试打开该文件esp8266_server.streamFile(file, contentType);// 并且将该文件返回给浏览器file.close(); // 并且关闭文件return true; // 返回true}return false; // 如果文件未找到，则返回false }// 获取文件类型 String getContentType(String filename){if(filename.endsWith(".htm")) return "text/html";else if(filename.endsWith(".html")) return "text/html";else if(filename.endsWith(".css")) return "text/css";else if(filename.endsWith(".js")) return "application/javascript";else if(filename.endsWith(".png")) return "image/png";else if(filename.endsWith(".gif")) return "image/gif";else if(filename.endsWith(".jpg")) return "image/jpeg";else if(filename.endsWith(".ico")) return "image/x-icon";else if(filename.endsWith(".xml")) return "text/xml";else if(filename.endsWith(".pdf")) return "application/x-pdf";else if(filename.endsWith(".zip")) return "application/x-zip";else if(filename.endsWith(".gz")) return "application/x-gzip";return "text/plain"; }
-
3;通过网页文本框控制ESP8266开发板的PWM引脚
-
/********************************************************************** 项目名称/Project : 零基础入门学用物联网 程序名称/Program name : 3_4_3_SPIFFS_Multi_Text_Server 团队/Team : 太极创客团队 / Taichi-Maker (www.taichi-maker.com) 作者/Author : CYNO朔 日期/Date（YYYYMMDD） : 20200220 程序目的/Purpose : 演示如何通过ESP8266开发板建立的多个网页文本框获取用户输入的信息。 ----------------------------------------------------------------------- 修订历史/Revision History 日期/Date 作者/Author 参考号/Ref 修订说明/Revision Description ----------------------------------------------------------------------- 本示例程序为太极创客团队制作的《零基础入门学用物联网》中示例程序。 该教程为对物联网开发感兴趣的朋友所设计和制作。如需了解更多该教程的信息，请参考以下网页： http://www.taichi-maker.com/homepage/esp8266-nodemcu-iot/ ***********************************************************************/ #include <ESP8266WiFi.h> #include <ESP8266WiFiMulti.h> #include <ESP8266WebServer.h> #include <FS.h> ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象ESP8266WebServer esp8266_server(80);// 建立ESP8266WebServer对象，该对象用于响应HTTP请求。监听端口（80）void setup(void){Serial.begin(9600); Serial.println("");wifiMulti.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) { // 尝试进行wifi连接。delay(1000);Serial.print(i++); Serial.print(' ');}// WiFi连接成功后将通过串口监视器输出连接成功信息 Serial.println('\n');Serial.print("Connected to ");Serial.println(WiFi.SSID()); // 通过串口监视器输出连接的WiFi名称Serial.print("IP address:\t");Serial.println(WiFi.localIP()); // 通过串口监视器输出ESP8266-NodeMCU的IPif(SPIFFS.begin()){ // 启动闪存文件系统Serial.println("SPIFFS Started.");} else {Serial.println("SPIFFS Failed to Start.");} //初始化网络服务器esp8266_server.on("/LED-Control", handleLEDControl); esp8266_server.onNotFound(handleUserRequest); // 处理其它网络请求// 启动网站服务esp8266_server.begin();Serial.println("HTTP server started"); }void loop(void){esp8266_server.handleClient(); //处理网络请求 } void handleLEDControl(){// 从浏览器发送的信息中获取控制数值（字符串格式）String value1 = esp8266_server.arg("value1"); String value2 = esp8266_server.arg("value2");// 将用户输入的信息通过串口监视器显示出来Serial.print("value1 = ");Serial.println(value1);Serial.print("value2 = ");Serial.println(value2);// 建立基本网页信息显示当前数值以及返回链接String httpBody = "value1: " + value1 + "<br> value2: " + value2 + "<p><a href=\"/LED.html\"><-LED Page</a></p>"; esp8266_server.send(200, "text/html", httpBody); }// 处理用户浏览器的HTTP访问 void handleUserRequest() { // 获取用户请求资源(Request Resource）String reqResource = esp8266_server.uri();Serial.print("reqResource: ");Serial.println(reqResource);// 通过handleFileRead函数处处理用户请求资源bool fileReadOK = handleFileRead(reqResource);// 如果在SPIFFS无法找到用户访问的资源，则回复404 (Not Found)if (!fileReadOK){ esp8266_server.send(404, "text/plain", "404 Not Found"); } }bool handleFileRead(String resource) { //处理浏览器HTTP访问if (resource.endsWith("/")) { // 如果访问地址以"/"为结尾resource = "/index.html"; // 则将访问地址修改为/index.html便于SPIFFS访问} String contentType = getContentType(resource); // 获取文件类型if (SPIFFS.exists(resource)) { // 如果访问的文件可以在SPIFFS中找到File file = SPIFFS.open(resource, "r"); // 则尝试打开该文件esp8266_server.streamFile(file, contentType);// 并且将该文件返回给浏览器file.close(); // 并且关闭文件return true; // 返回true}return false; // 如果文件未找到，则返回false }// 获取文件类型 String getContentType(String filename){if(filename.endsWith(".htm")) return "text/html";else if(filename.endsWith(".html")) return "text/html";else if(filename.endsWith(".css")) return "text/css";else if(filename.endsWith(".js")) return "application/javascript";else if(filename.endsWith(".png")) return "image/png";else if(filename.endsWith(".gif")) return "image/gif";else if(filename.endsWith(".jpg")) return "image/jpeg";else if(filename.endsWith(".ico")) return "image/x-icon";else if(filename.endsWith(".xml")) return "text/xml";else if(filename.endsWith(".pdf")) return "application/x-pdf";else if(filename.endsWith(".zip")) return "application/x-zip";else if(filename.endsWith(".gz")) return "application/x-gzip";return "text/plain"; }
-
其他详见太极创客官网