zoukankan      html  css  js  c++  java
  • ESP8266基于WebServer实时获取温湿度

    功能描述:通过在浏览器中访问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);
    }

  • 相关阅读:
    POJ2406【KMP-next数组】
    POJ2752【KMP-next数组含义】
    POJ3696【欧拉函数+欧拉定理】
    POJ3692【二分匹配】
    POJ3697【BFS】
    CodeForces599D【数学】
    CodeForces599C【贪心】
    HDU1829【种类并查集】
    HDU3038【种类并查集】
    POJ1182【种类并查集】
  • 原文地址:https://www.cnblogs.com/GetcharZp/p/13582396.html
Copyright © 2011-2022 走看看