ESP8266:通过网页文本控制PWM引脚来控制灯的亮度
本帖最后由 划句顾 于 2021-9-8 13:08 编辑点击视频--点赞球球了{:10_281:}
资源包:
代码如下:
这部分和上一个代码有很多一样的地方。
/***
*author:LaoGu
*time:2021/9/4
*purpose:使用ESP8266-NodeMCU建立一个有多个页面的网站。通过LED页面
的文本输入可以控制板上LED的亮度。
**/
#include<ESP8266WiFi.h>
#include<ESP8266WiFiMulti.h>
#include<ESP8266WebServer.h>
#include<FS.h>
ESP8266WiFiMulti wifiMulti;
ESP8266WebServer esp8266_server(80);
void setup() {
Serial.begin(9600);
Serial.println("");
pinMode(LED_BUILTIN,OUTPUT);
wifiMulti.addAP("小G的wife","gyl5201314");
wifiMulti.addAP("nanjishit","guyiling5201314");
Serial.println("Connecting...");
int i = 0;
while(wifiMulti.run()!=WL_CONNECTED){
delay(1000);
Serial.print(i++); Serial.print(" ");
}
Serial.println("\n");
Serial.print("Connected to ");
Serial.println(WiFi.SSID());
Serial.print("IP address: ");
Serial.println(WiFi.localIP());
if(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() {
esp8266_server.handleClient();//处理网络请求
}
static/image/hrline/5.gif
不一样在这里
void handleLEDControl(){
//从浏览器发送的信息中获取PWM控制数值(字符串格式)
String ledPwm = esp8266_server.arg("ledPwm"); //通过arg()函数,我们可以获取客户端向ESP8266物联网服务器发送的指定参数的数值。
//将字符串格式的PWM控制数值转换为整数
int ledPwmVal = ledPwm.toInt();
//实施引脚PWM设置
analogWrite(LED_BUILTIN,ledPwmVal);
//建立基本网页信息显示当前数值以及返回链接
String httpBody = "LED PWM:" + ledPwm + "<p><a href = \"/LED.html\"><-LED Page</a></p>";
esp8266_server.send(200,"text/html",httpBody);
}
static/image/hrline/5.gif
处理用户浏览器的HTTP的访问
void handleUserRequest(){
//获取用户请求资源
String reqResource = esp8266_server.uri();
Serial.print("reqResource: ");
Serial.println(reqResource);
//通过handleFileRead函数处理用户请求资源
bool fileReadOK = handleFileRead(reqResource);
//如果在SPIFFS无法找到用户访问的资源,则回复404
if(!fileReadOK){
esp8266_server.send(404,"text/plain","404: NOT FOUND");
}
}
static/image/hrline/5.gif
下面两个代码也是不怎么改变,和之前一样。
bool handleFileRead(String resource){
if(resource.endsWith("/")){
resource = "/index.html";
}
String contentType = getContentType(resource);
if(SPIFFS.exists(resource)){
File file =SPIFFS.open(resource,"r");
esp8266_server.streamFile(file,contentType);
file.close();
return true;
}
return false;
}
static/image/hrline/5.gif
// 获取文件类型
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";
}
static/image/hrline/5.gif
串口:
static/image/hrline/5.gif
效果:
{:10_256:}评论有几率拿到币,能不能帮我的视频去B站点个赞捏。 真好,完全不懂 50%的中奖几率 点赞 支持一下 {:10_277:} {:10_256:}{:10_256:}{:10_256:} 拿币{:10_256:} 没有,再来!!!{:10_256:} 666666666666 {:10_257:}{:10_254:} 表示看不懂 点赞表示支持{:10_254:} {:10_256:} {:5_95:} 帮我的视频点点赞吧,去B站看看giao{:10_266:}
参观大佬 {:7_146:} 学习 眼