Arduino，Nodemcu,ESP8266网络连接（局域网），网页控制内部LED状态变化
| 阿里云国内75折 回扣 微信号：monov8 |
| 阿里云国际，腾讯云国际，低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号：monov8 飞机：@monov6 |
整体思路无线终端模式
需要注意esp8266是 802.11n⽀支持**(2.4GHz )也就是平常说的wifi4WiFi5G是连不上的**
配置指定的LED接口配置网络的WiFi记录ESP8266模块做为服务器的IP用于浏览器访问登录浏览器输入服务器ip读取浏览器中动作控制LED口电平变化。
实例程序
基本把程序文件下载到开发板的基础操作参考https://blog.csdn.net/weixin_43794311/article/details/128666871
直接看程序
#include <ESP8266WiFi.h> // 调用ESP8266WiFi库
#include <ESP8266WiFiMulti.h> // 调用ESP8266WiFiMulti库连接外部WiFi
#include <ESP8266WebServer.h> // 调用ESP8266WebServer库建立开发板自己服务器
ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti对象,对象名称是 'wifiMulti'用于连接外部wifi
ESP8266WebServer esp8266_server(80);// 建立网络服务器对象该对象用于响应HTTP请求监听端口80用于建立开发板自己的服务器
void setup(void){
Serial.begin(9600); // 启动串口通讯为了显示开发板服务器地址
pinMode(D4, OUTPUT); //设置内置LED引脚为输出模式以便控制LED
//通过addAp函数存储 WiFi名称 WiFi密码
wifiMulti.addAP("Tenda_2E5100", "88888888"); //设置自己想要连接的网络
// wifiMulti.addAP("HUAZHU-JiHotel", ""); // 这2条语句通过调用函数addAP来记录2个不同的WiFi网络信息。
// wifiMulti.addAP("room-8607", "62131498"); //此处WiFi信息只是示例请在使用时将需要连接的WiFi信息填入相应位置。
// 这里只存储了2个WiFi信息您可以存储更多的WiFi信息在此处。
Serial.println("\nMAR It's connectting Wifi..."); //在串口打印字符串
int i = 0;
while (wifiMulti.run() != WL_CONNECTED) { // 此处的wifiMulti.run()是重点。通过wifiMulti.run()ESP8266将会在当前
delay(1000); // 环境中搜索addAP函数所存储的WiFi。如果搜到多个存储的WiFi那么ESP8266
Serial.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-ESP8266的IP
esp8266_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'
该函数的作用是每当有客户端访问ESP8266服务器根目录时
ESP8266都会向访问设备发送 HTTP 状态 200 (Ok) 这是send函数的第一个参数。
同时ESP8266还会向浏览器发送HTML代码以下示例中send函数中第三个参数
也就是双引号中的内容就是ESP8266发送的HTML代码。该代码可在网页中产生LED控制按钮。
当用户按下按钮时浏览器将会向ESP8266的/LED页面发送HTTP请求请求方式为POST。
ESP8266接收到此请求后将会执行handleLED函数内容*/
void handleRoot() {
esp8266_server.send(200, "text/html", "<form action=\"/LED\" method=\"POST\"><input type=\"submit\" value=\"LED\"></form>");
}
//处理LED控制请求的函数'handleLED'
void handleLED() {
digitalWrite(D4,!digitalRead(D4));// 改变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"
}
几个库函数的使用含义
参考https://blog.csdn.net/qq_41477556/article/details/113032520
esp8266_server.send
http://www.taichi-maker.com/homepage/iot-development/iot-dev-reference/esp8266-c-plus-plus-reference/esp8266webserver/send/
“Content-Type” 指示响应体的内容是什么类型。这里的响应体内容类型是“text/htm”即网页HTML代码。
假设某一个响应头中**“Content-Type” 类型是”image/jpeg”。这就意味着该响应体中的信息是一个jpeg格式的图片**那么浏览器也就会按照jpeg的解码方式将图片呈现在我们的面前
esp8266_server.sendHeader
http://www.taichi-maker.com/homepage/iot-development/iot-dev-reference/esp8266-c-plus-plus-reference/esp8266webserver/sendheader/
状态码含义
参考https://zhuanlan.zhihu.com/p/60669395
303收到后跳转查看其他路径网页例如从电脑登录账号信息正确时服务器会返回一个欢迎登录的界面
需要注意的地方
1想要连接的WiFi一定要是2.4GHZ的WiFi不能是5G的wifi
2程序上传成功后开发板做为服务器的IP地址需要通过Arduino的ide的监视窗口查看
>1,在上传完成后打开串口监视器调整波特率和程序中设置的串口波特率一样
>2复位开发板因为连接WiFi成功后只打印一次IP那时候可能串口监视还未打开所以没显示
>3确认已打开串口并设置正确波特率记录开发板设置的服务器IP
3确认一个设备电脑或手机连接到和开发板一个局域网wifi
4打开设备的浏览器输入串口打印的IP值就可看见一个名为LED的按钮按动可控制ESP8266的内置LED的亮灭
操作图示
连接好开发板并下载好文件后
打开串口监视器
按下开发板的rst也就是复位键
查看开发板建立的服务器IP并连接同一个2.4Ghz的wifi
登录设备浏览器输入IP后会出现网页
