一、esp开发板引脚的开关控制
两个按钮的HTML代码如下:
<form action="LED-Control"><input type="submit" value="LED控制">
</form>
<br>
<form action="index.html"><input type="submit" value="返回首页">
</form>
可实现当点击 led控制 按钮时,浏览器向esp8266发送“/LED-Control"的请求;
esp收到请求后,通过下面的代码执行handleLEDControl()函数,开关led;
void setup(){
pinMode(LED_BUILTIN, OUTPUT); // 初始化NodeMCU控制板载LED引脚为OUTPUT
esp8266_server.on("/LED-Control", handleLEDControl); // 告知系统如何处理/LED-Control请求
esp8266_server.begin(); // 启动网站服务
}
// 改变led的状态
void handleLEDControl(){
bool ledStatus = digitalRead(LED_BUILTIN); // 此变量用于储存LED状态
ledStatus == HIGH ? digitalWrite(LED_BUILTIN, LOW) : digitalWrite(LED_BUILTIN, HIGH); // 点亮或者熄灭LED
esp8266_server.send(303);
}
二、esp开发板模拟量引脚控制:
中间的输入框和按钮的html代码如下:
<form action="/LED-Control">
<input type="text" name="ledPwm">
</br>
<input type="submit" value="OK">
</form>
void handleLEDControl(){
/从浏览器发送的信息中获取PWM控制数值(字符串格式)
String ledPwm = esp8266_server.arg("ledPwm");
/将字符串格式的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);
}
String ledPwm = esp8266_server.arg("ledPwm");
arg函数:
说明
使用本函数,我们可以获取客户端向ESP8266物联网服务器发送的指定参数的数值。
语法
server.arg(Name)
server.arg(index)
参数
– Name
请求体中的参数名(参数类型: String)– index
请求体中的参数序列号(参数类型: int)返回值
指定参数的数值(类型:String)
三、利用JavaScriptesp实现开发板模拟量引脚的图形界面控制:
后端程序基本一样,主要是前端不同;
// 处理PWM设置请求并对引脚进行PWM设置
void handlePWM(){
String pwmStr = esp8266_server.arg("pwm"); // 获取用户请求中的PWM数值
int pwmVal = pwmStr.toInt(); // 将用户请求中的PWM数值转换为整数
pwmVal = 255 - map(pwmVal,0,100,0,255); // 用户请求数值为0-100,转为0-1023
analogWrite(LED_BUILTIN, pwmVal); // 实现PWM引脚设置
esp8266_server.send(200, "text/plain");//向客户端发送200响应信息
}