功能描述:通过在浏览器中访问ESP8266提供的服务来获取其实时的温湿度信息;
操作步骤:
第一步、将下面的代码烧录到Esp中;
第二步、打开串口调试工具查看该ESP8266的IP地址
第三步、访问 IP地址/index.html 这个网址来获取实时的温湿度
#include <ESP8266WiFi.h> const char* ssid = "Wi-Fi名称"; const char* password = "Wi-Fi密码"; int temp = 0;//温度 int humi = 0;//湿度 unsigned int loopCnt; int chr[40] = {0}; unsigned long timer; #define pin D4 WiFiServer server(80); /** * 获取温湿度 */ void get_humiture() { bgn: delay(2000); //设置2号接口模式为:输出 //输出低电平20ms(>18ms) //输出高电平40μs pinMode(pin,OUTPUT); digitalWrite(pin,LOW); delay(20); digitalWrite(pin,HIGH); delayMicroseconds(40); digitalWrite(pin,LOW); //设置2号接口模式:输入 pinMode(pin,INPUT); //高电平响应信号 loopCnt=10000; while(digitalRead(pin) != HIGH) { if(loopCnt-- == 0) { //如果长时间不返回高电平,输出个提示,重头开始。 // Serial.println("HIGH"); goto bgn; } } //低电平响应信号 loopCnt=30000; while(digitalRead(pin) != LOW) { if(loopCnt-- == 0) { //如果长时间不返回低电平,输出个提示,重头开始。 // Serial.println("LOW"); goto bgn; } } //开始读取bit1-40的数值 for(int i=0;i<40;i++) { while(digitalRead(pin) == LOW) {} //当出现高电平时,记下时间“timer” timer = micros(); while(digitalRead(pin) == HIGH) {} //当出现低电平,记下时间,再减去刚才储存的timer //得出的值若大于50μs,则为‘1’,否则为‘0’ //并储存到数组里去 if (micros() - timer >50) { chr[i]=1; }else{ chr[i]=0; } } //湿度,8位的bit,转换为数值 humi=chr[0]*128+chr[1]*64+chr[2]*32+chr[3]*16+chr[4]*8+chr[5]*4+chr[6]*2+chr[7]; //温度,8位的bit,转换为数值 temp=chr[16]*128+chr[17]*64+chr[18]*32+chr[19]*16+chr[20]*8+chr[21]*4+chr[22]*2+chr[23]; } void setup() { pinMode(D4, OUTPUT); Serial.begin(115200); delay(10); WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print("."); } Serial.println(""); Serial.println("WiFi connected"); // Start the server server.begin(); Serial.println("Server started"); // Print the IP address Serial.println(WiFi.localIP()); } void loop() { // Check if a client has connected WiFiClient client = server.available(); if (!client) { return; } // Wait until the client sends some data Serial.println("new client connected"); while(!client.available()){ delay(1); } // Read the first line of the request String req = client.readStringUntil(' '); Serial.println(req); client.flush(); get_humiture(); // Prepare the response String page = "HTTP/1.1 200 OK Content-Type: text/html <!DOCTYPE HTML> <html> <head>"; page += "<meta charset='utf-8'>"; // page += " <link href='https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css' rel='stylesheet'>"; page += " <script src='https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js'></script>"; page += " </head> <body style='padding:10px'>"; page += " <h1>实时温湿度:</h1><br>"; // 日期 page += " <div id='date'></div><br>"; String humistring = "温度: "; humistring += temp; humistring += " 湿度:"; humistring += humi; // 温湿度 page += " <div id='content'>"; page += humistring; page += "</div><br>"; page += " <script> "; page += "var date = new Date(); $('#date').text(date);"; page += " "; page += "setInterval(function(){$.post('/gethumi', {}, function(res) {var date = new Date(); $('#date').text(date); $('#content').html(res);})}, 3000);"; page += " "; page += "console.log('" + humistring + "')"; page += " </script>"; page += " </body> </html> "; // Match the request if (req.indexOf("/index.html") != -1) { client.print(page); return; } else if (req.indexOf("/gethumi") != -1) { String humires = "HTTP/1.1 200 OK Content-Type: text/html <!DOCTYPE HTML> <html> <head>"; humires += "<meta charset='utf-8'></head><body>"; humires += humistring; humires += "</body></html>"; client.print(humires); } else { Serial.println("invalid request"); client.stop(); return; } delay(1); }