[Day20] Esp32用AP mode + AHT10 - (程序码讲解)

1.前言

首先,祝各位中秋佳节愉快~(明天又要继续上班上课了),不知道各位小夥伴连假期间是否在某些方面有些进步了呢?!(当然是知识的进步啦!!)扯远了。回归正题,昨天的程序码中运用到许多新花样,然而这些技术如要学都算是更高阶级的技术了,如AHT10所用到的I²C介面,I²C的应用就篇较後面学习的了,因为关系到晶片的运作原理,所以今天先讲较为简单的函式库,如後面有机会在跟各位谈I²C。

2.ESPAsyncWebServer

ESPAsyncWebServer是款支援Esp32与Esp8266的一套函式库,Esp8266是款比Esp32更小的晶片,且Esp8266是Esp32得前身,所以Esp8266也有WiFi等功能,那如果仔细观看程序码会发现此次程序码变很不同,那是因为此函式库的特别之处,客户端请求分析不是由loop处理

如安装ESPAsyncWebServer,就还要安装AsyncTCP,因为ESPAsyncWebServer是建立在AsyncTCP上去跑的。

2-1.基本ESPAsyncWebServer的指令

  1. 导入函数库
  2. 设定服务的通讯埠
  3. 利用on()方法抓取数值
  4. 监听服务begin()

3.程序码解说

刚刚有说基本的指令对,所以这边稍微讲一下

导入函式库

#include <ESPAsyncWebServer.h>

设定服务的通讯埠

AsyncWebServer server(80);

80这个通讯埠属於http,也是网页预设会预先进入的通讯埠

server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/html", index_html, processor);
  });
  server.on("/temperature", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/plain", String(t).c_str());
  });
  server.on("/humidity", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/plain", String(h).c_str());
  });

这边算是设定,也就是server.on("目录位置",接收方式,接收型态),所以第111、114、117行是设定这三个页面(预设会先进/,除非在IP方打上/temperature,才会进入不同页面)。
request->send_P(HTTP状态码,类型,资料)。
那这三行主要就是後面资料的部分,资料会找到上面的86行,进行判断,如果var的值是如何就回传该数值,举例进入if(var == "TEMPERATURE"),那就会回传t的数值(下方loop()里面有在抓取t的数值),但t会从int转成String(因为t变数前面有加String,所以会强制转型)

String processor(const String& var){
  //Serial.println(var);
  if(var == "TEMPERATURE"){
    return String(t);
  }
  else if(var == "HUMIDITY"){
    return String(h);
  }
  return String();
}

欢迎交流

好了,连假最後一天内容也就不要那麽多了,也让脑袋放松一下!!那下次会讲解loop是如何一直读取数值的,所以可以好好期待一下後天那篇文章,那明天会讲解STA + AHT10的部分,希望大家对此函式库有多一分的了解,也希望这次得讲解你们听得清楚,那就明天在会罗~


<<:  第 6 集:CSS 社交距离(下)

>>:  铁人赛 Day21 -- Bootstrap 初体验

第 6 集:CSS 社交距离(下)

此篇会介绍使用 text-align、vertical-align 对齐时的注意事项以及常见问题,最...

Day 13 CSS <属性书写顺序 & 网页布局-标准布局>

CSS属性书写顺序建议 建议遵循以下顺序 1. 布局定位属性 : display / positio...

Day2 - P5基本操作 - 基本设定跟操作

其实为什麽P5这麽多人喜爱 阅读性真的很高,举例来讲好了 一个基本的设定 首先你先设定 setup ...

[Day9]Beat the Spread!

上一篇介绍了Rare Easy Problem,是一题比较难的题目,但是在了解题目是怎麽算得之後,最...

Day21 样式变化(动画)5

列表移动过渡(List move transition) 不仅可以做出淡出与淡入,还可以改变位置,只...