第一、原理讲解

原理简述:利用发布订阅模式。第一步,先读取DHT11温湿度数值,第二步,新建主题,然后esp8266往这个主题发送消息,第三步。小程序通过http API接口获取数据。小程序控制原理:esp8266订阅了一个主题,小程序往这个主题发消息,esp8266就可以收到消息,就可以执行相关控制指令了(开/关函数)

关于发布订阅:

订阅(订阅):订阅给定的一个主题/频道的信息。 发布(发布)将信息发送到指定的主题/频道。

只有订阅该主题的设备才可以收到发往该主题的消息。

通俗的来讲:就是像邮件订阅的场景,什么意思呢,也就是说100个人订阅了你的博客,如果博主发表了文章,那么100个人就会同时收到通知邮件,订阅/发布模式就是这样的原理。

如果还不理解的话再通俗讲一下,就像生活中听收音机,要想听收音机,肯定就是调频啦,只有在正确的频道上面,我们才能听得到好听的节目,所以说订阅首先要订阅一个频道/主题,只有订阅了该主题,我们才能收到发往该频道/主题的消息。

程序讲解:在本示例中,ESP8266 有两个角色,一个是temp(传感器数据)主题消息的发布者,esp8266往这个主题推送消息,小程序就可以收到传感器数据了。 esp8266联网后,订阅light002,手机往这个主题推送消息,esp8266就能收到手机的控制的指令了。

第二、ESP8266读取DHT11

这里使用的是D4口。

本demo 是利用arduino IDE开发,关于arduino IDE 的ESP8266环境配置可参考:环境配置: 点击跳转

安装库 本案例使用一个非常简单易用且与ESP8266配合使用的是Simple DHT传感器库。可以通过Arduino IDE Library Manager轻松安装该库。

在 arduino IDE上方选项处----> 工具--->管理库,然后直接搜索dht11即可。点击安装库,如下图:

测试程序:

#include <SimpleDHT.h>// for DHT11,
//      VCC: 5V or 3V
//      GND: GND
//      DATA: 2
int pinDHT11 = D4;
SimpleDHT11 dht11(pinDHT11);void setup() {Serial.begin(115200);
}void loop() {// start working...Serial.println("=================================");Serial.println("Sample DHT11...");// read without samples.byte temperature = 0;byte humidity = 0;int err = SimpleDHTErrSuccess;if ((err = dht11.read(&temperature, &humidity, NULL)) != SimpleDHTErrSuccess) {Serial.print("Read DHT11 failed, err="); Serial.println(err);delay(1000);return;}Serial.print("Sample OK: ");Serial.print((int)temperature); Serial.print(" *C, "); Serial.print((int)humidity); Serial.println(" H");// DHT11 sampling rate is 1HZ.delay(1500);
}

正常工作的话,串口会正常输出的,如下图所示:

第三、温湿度推送到云端

如果上一步的温湿度可以读取输出,那么就可以在上版的基础上,把数据上传到云端。

增加了按钮控制,数据用#号包裹,以便app采用字符串切割,分割出来数据,&msg=#23#80#on#rn,即#温度#湿度#按钮状态#,app端会根据#号分割字符串进行取值,以便显示。

如果上传的数据不止温湿度,可在#号后面继续添加&msg=#23#80#data1#data2#data3#data4#rn,app字符串分割的时候,要根据上传的数据进行分割

升级版程序下载:

点击下载 http://www.cloud.bemfa.com/zip/dht11_LED.zip

需要修改的地方

///****************需要修改的地方*****************/////WIFI名称,区分大小写,不要写错
#define DEFAULT_STASSID  "newhtc"
//WIFI密码
#define DEFAULT_STAPSW "qq123456"
//用户私钥,可在控制台获取,修改为自己的UID
String UID = "7d54f85af42976ee3c2693e692a6bb59";
//主题名字,可在控制台新建
String TOPIC = "temp"; //用于传输温湿度的主题
//DHT11引脚值
int pinDHT11 = D4;  //连接dht11的引脚
//单片机LED引脚值
const int LED_Pin = D2;  //假设连接led的引脚
//主题名字,可在控制台新建
String TOPIC2  = "light002";  //用于led控制的主题///*********************************************///

巴法创客云控制台 新建一个主题,主题名字随意,例如temp,本实例用用temp,使用示例代码时应修改为自己的主题名字,字母或数字或字母加数字组合。UID为用户私钥,在 巴法创客云控制台 注册登陆后可获得。 登陆完成后,可在控制台看到自己的私钥UID,如图所示:

创建主题,在控制台,可创建主题。

  • 第一输入主题,字母或数字或字母+数字组合。
  • 点击创建主题,要创建两个主题,一个主题用来传递传感器数据,另一个主题用来进行LED灯的控制。在本例程中一个主题名字是:temp ,另一个主题名字是:light002,可自定义或修改,不过下方小程序里面的主题名字要和esp8266的主题保持一致,以便正常的往同一个主题发布订阅。

WIFI名称为自己的路由器WIFI名称,区分大小写,写错会导致连接不上网络的。

例程中,每两秒上传一次数据:

if(millis() - preHeartTick >= upDataTime){//上传数据preHeartTick = millis();/*****************获取DHT11 温湿度*****************/// read without samples.byte temperature = 0;byte humidity = 0;int err = SimpleDHTErrSuccess;if ((err = dht11.read(&temperature, &humidity, NULL)) != SimpleDHTErrSuccess) {Serial.print("Read DHT11 failed, err="); Serial.println(err);delay(1000);return;}/*********************数据上传*******************/String upstr = "";upstr = "cmd=2&uid="+UID+"&topic="+TOPIC+"&msg=#"+temperature+"#"+humidity+"#"+bt_status+"#rn";sendtoTCPServer(upstr);upstr = "";}

如果路由器有网络的话,数据会自动上传,可在巴法创客云控制台 刷新网页,即可看到上传的数据。如下图所示:

数据上传时用#号进行了封装,27是温度,24是湿度,off是上传的灯的状态。

第四、小程序开发

在 公众平台注册小程序账号,拿到小程序 appid,长的大概是这样:34a2063de5cec04b,下面导入项目的时候会用到。

右侧点击 -开发--》开发设置--》下方服务器域名处,点击修改,在request合法域名处,添加域名https://api.bemfa.com/ 保存提交即可。如下图。

下载安装开发者工具。 下载demo示例程序。下载地址: 点击下载

打开开发者工具,小程序项目,导入项目。在目录处选择刚刚下载解压的demo示例程序,AppID处填入你的小程序AppID,然后点击下方导入即可。如下图。

本示例程序非常简单,各位大神可以继续开发添加各种功能,添加背景,优化色彩等等,如果只是简单使用,只需修改/pages/index/index.js 文件中uid 和topic 信息为自己的即可,这里的uid和topic需要和esp8266填入的uid和topic相同,这里有两个主题,一个用于传输温度和湿度,一个用于控制LED。如下图。

修改完毕后,ctrl+s 保存修改。可以点击左边屏幕上的按钮进行调试,如下图。

console控制台可以查看小程序的调试信息。默认每2秒会自动请求一下服务器上的数据,以便查看esp8266的状态信息。点击打开或者关闭按钮,打开esp8266串口调试助手,可查看esp8266是否收到指令,如果第一步esp8266已联网,都是可以收到信息的。

如果界面和其他功能都开发完毕。可以点击开发者工具的上面的上传按钮,如下图。

上传成功后,再登陆刚刚注册的公众平台,在版本管理处,可以看到自己刚刚上传的小程序,提交审核即可,等一天左右,一般都会通过,通过后登陆公众平台,提交发布即可。如果是自己使用的,做好加上登陆验证功能,比如验证匹配一下某个字符串是否正确等等,不然小程序上线后别人也可以随意控制了。

vc 控制台添加托盘显示_开源:ESP8266读DHT11温湿度,小程序实时显示相关推荐

  1. ESP8266读DHT11温湿度,开发微信小程序实时显示

    ESP8266读DHT11温湿度,开发微信小程序实时显示 第一.原理讲解 第二.ESP8266读取DHT11 第三.温湿度推送到云端 第四.微信小程序开发 个人可免费注册五个微信小程序账号. 第一.原 ...

  2. (可远程)ESP8266读DHT11温湿度,APP inventor制作app实时显示

    ESP8266读DHT11温湿度传感器------APP inventor实时显示 原理讲解 ESP8266读取DHT11 温湿度推送到云端 app inventor 制作app 接收实时数据 关键程 ...

  3. 倒计时小程序桌面显示_【新版本更新!】小程序可以添加到电脑桌面啦,随点随学,备考更轻松!...

    进日微信电脑版终于推出 3.0.0 版本,该版本支持小程序可添加到电脑桌面,超级方便!简单三步教你如何把小程序添加到桌面使用起来更轻松! 01 检查微信版本是否是最新版本 登录微信电脑端后,点击右下角 ...

  4. vc 控制台添加托盘显示_编程达人

    看到火哥给他的程序加上了系统托盘,我的没有很是不爽.于是花了几分钟找了些资料,给自己的也加上了系统托盘.现在将我的实现步骤分享一下. 先来解释下什么是系统托盘:其实准确的说法应该是任务栏通知区域.系统 ...

  5. udp服务器实时显示温湿度,(可远程)ESP8266读DHT11温湿度,APP inventor制作app实时显示...

    原理讲解 原理简述:利用发布订阅模式.第一步,先读取DHT11温湿度数值,第二步,新建主题,然后esp8266往这个主题发送消息,第三步.app inventor 订阅这个主题,因为app inven ...

  6. dwcs6怎么添加搜索框_一文教会你微信小程序搜索怎么用、怎么优化

    生活中我们常常会用到微信小程序,但很多人不知道该如何搜索.找到小程序:而有些已经做了自己的小程序的商家,也不懂怎么提升自己的微信小程序搜索效果.所以下面就跟大家科普下这两个问题. 1.怎么搜索微信小程 ...

  7. vc 控制台添加托盘显示_和硕县塑胶托盘塑料周转筐多少钱、延安塑料物流箱

    他们正是利用了消费者的这种心理,往产品里添加一部分碳酸钙等重物质,不仅仅降低了他们的生成成本也极大的提高了产品自身重量,消费者却被蒙在鼓里.物流与采购联合会托盘专业委员会于2002年9月对北京.天津. ...

  8. vc 控制台添加托盘显示_VC添加托盘图标

    1.define一个消息ID   WM_SHOWTASK用于接收托盘消息 #define WM_SHOWTASK (WM_USER+1000) 2.在窗体初始化处贴下方代码: NOTIFYICONDA ...

  9. 在小程序中显示地图并添加标注的教程

    前言 需求: 在小程序里显示地图,并标记地图上的一个坐标点. 管理员可以在后台设置坐标点 小程序显示地图和坐标点 .wxml文件 <view style="display:flex; ...

最新文章

  1. 基于RNN的NLP机器翻译深度学习课程 | 附实战代码
  2. linux kernel同步方法的总结
  3. cmake的使用-为什么要使用CMake
  4. python 将ipv4的格式转换
  5. PTA天梯赛L1-006 连续因子 (20分)
  6. [SCOI2003]字符串折叠
  7. java操作elasticsearch实现前缀查询、wildcard、fuzzy模糊查询、ids查询
  8. 终于学会了 MySQL 主从配置和读写分离
  9. 景观分析工具:arcgis中patch analysis模块
  10. 英特尔发布CPU新架构,突破性采用3D堆栈法
  11. 6-2-二叉树(二叉链表存储)-树和二叉树-第6章-《数据结构》课本源码-严蔚敏吴伟民版...
  12. 前端全栈必会node框架koa。。。
  13. [转]数据库连接方式读取不到Excel数据值的解决方法
  14. ActivityGroup和TabActiviy的差异性?
  15. Incapsula CDN 入门指南
  16. GE HYDRAN M2 IS200VCRCH1B IS200VRTDH1D IS200VTCCH1CBB IS200VTURH2BAC IS215VPROH1BD IS220PAICH2A
  17. 基于MBR 的bootkit的进展 鬼影-TDL4-BMW
  18. linux java调优
  19. 巧用快捷键轻松设置Eexel单元格格式(转)
  20. 7系列FPGA数据手册:概述------中文翻译版

热门文章

  1. 【微服务学习】Polly:熔断降级组件
  2. DevOps/.NET 微服务 秋季分享会领优惠门票
  3. qMISPlat入门级使用问题解答一
  4. Actor-ES框架:Ray-Handler之CoreHandler编写
  5. 通过Chocolatey软件包管理器安装.NET Core
  6. ASP.NET Core中如何调整HTTP请求大小的几种方式
  7. 20分钟完成Mac上的 LNMP 环境部署,优雅·高效开发(Docker方式)
  8. C#+SQL Server数据库系统操作日志的实现完整案例
  9. C语言试题三十五之找出一维整型数组元素中最大的值和它所在的下标,最大的值和它所在的下标通过形参传回。主函数中x是数组名,n 是x中的数据个数,max存放最大值,index存放最大值所在元素的下标。
  10. C语言试题二十三之编写一个函数void function(int tt[m][n],int pp[n]),tt指向一个m行n列的二维函数组,求出二维函数组每列中最小元素,并依次放入pp所指定一维数组中