本系列属于支付宝小程序控制智能硬件 esp8266等芯片的思路编程,欢迎大家点点手指关注我半颗心脏,博客文章列表干货多多,有任何疑问评论区留言,第一时间看到回复!

【支付宝小程序控制硬件①】 申请个人支付宝下程序开发的个人账户,认识支付宝小程序框架结构,做好智能控制第一步!
【支付宝小程序控制硬件②】 全网首篇,个人支付宝小程序控制智能硬件esp8266,从设计电路到设计协议控制两盏LED灯调节亮度。


文章目录

  • 一、前言;
  • 二、准备材料;
  • 三、注册支付宝小程序账号;
    • 3.1 注册;
  • 四、通讯原理以及协议;
  • 五、mqtt服务器搭建;
  • 六、设备端代码部分讲解;
  • 七、支付宝小程序代码部分讲解;
  • 八 、后记;

一、前言;


当微信小程序崛起的时候,遇到了目前智能家居时代的时候,我做了一个微信小程序控制esp8266文章,之后网上很多都参考我思路,乃至图片都是和我一模一样的,哈哈!看来还行!

今天给大家带来的是我小练习项目— 个人支付宝小程序控制智能硬件esp8266,我敢肯定是全网首篇的,因为我目前在百度找不到哈哈!

前面章节我已经详细记录了我在支付宝小程序上集成mqtt协议的睬坑过程,现在回想起来依然是心累的,因为至今没有人测试和做这领域。作为“前人”,我深深感觉到是一种荣誉!可实现起来控制,而且还这样分享给大家一些笔记!

最近在备考,很多时间都不怎么写博客了!谅解!!因为有些梦想未在指定的时间内实现,即使老去,也会感慨后悔当初!


二、准备材料;


  • esp8266 nodeMcu 一个,杜邦线若干,高亮 3.3v LED灯若干个!
  • 支付宝小程序账号一个,请自行注册!
  • 手机上安装支付宝软件最新版,不分ios版还是Android版!调试小程序!
  • 对esp8266 rtos3.0的编程熟悉。
  • 电路设计如下:


  • 实物图:

三、注册支付宝小程序账号;


3.1 注册;


  • 访问:https://docs.alipay.com/mini/developer/getting-started,找到登录按钮用支付宝软件扫描就可以了!
  • 之后一路无脑式创建就可以了!
  • 下载开发 支付宝小程序专门的IDE开发工具,类似微信开发一样:https://docs.alipay.com/mini/ide/overview
  • 新建项目和导入项目,下面是本工程的截图,右上角有 模拟器调试预览上传主要功能:
    • 模拟器:本地新建一个手机模拟器,非真机环境,用来调试代码!我们mqtt调试切勿用模拟器调试!
    • 调试:是调试到真机功能,可以在IDE看到真机打印的日志!
    • 预览:也是调试到真机的功能,但是不可以在 IDE记录看到真机打印的日志!只能在本地真机调试!
    • 上传:上传到阿里云服务器,可以给其他用户扫描二维码体验,当然了 ,上传之后,就可以提交审核上架了!


四、通讯原理以及协议;


实现的控制的原理我之前用微信小程序控制esp8266的思路一致,总结如下:

  • 注意角色:(设备 --> esp8266,设备商云 --> 服务器,微信客户端 --> 支付宝小程序):
  • 先上图,也请认真观看上图,这是我本篇实现的控制过程,也是我想到的控制过程,哈哈!
  • 概述
    • ①:服务器我们采用自己的服务器,上位机就是支付宝客户端,我们是在支付宝的环境下开发的,也就避免不了和微信打交道,避免不了要遵循支付宝开发的规范!所以要有一定的前端开发知识哦!也就是H5+css+javaSrcipt,支付宝小程序开发和这个非常相似!如果想入门支付宝小程序开发,自己可以去琢磨!
    • ②:设备商云也就是我们的服务器,仅仅做一个中转信号处理,不做任何的消息存储和分析哈!
    • ③:通讯过程是 esp8266上报消息到服务器,服务器转发消息到支付宝小程序!反过来,微信小程序控制下发,先发送消息到服务器,然后到esp8266!
    • ④:既然服务器仅仅是一个中转信号处理,那么我们的支付宝小程序和esp8266的通讯协议,自己拟定就好,下面是我拟定的,也是本文项目的协议!

  • 支付宝小程序下发控制的通讯协议
主题 发送端 接收端 消息(JSON格式) 消息含义
/light/devsub 支付宝小程序 esp8266 “{“change”:“power”,“value”:true}” 开灯
“{“change”:“power”,“value”:“false”}” 关灯
“{“change”:“blue”,“value”:50}” 调节蓝灯亮度:value为亮度值 ,范围 [0,100]
“{“change”:“red”,“value”:50}” 调节红灯亮度:value为亮度值 ,范围 [0,100]
“{“change”:“query”,“value”:0}” 支付宝小程序主动请求最新状态
  • esp8266上报同步的通讯协议
主题 发送端 接收端 消息(JSON格式) 消息含义
/light/devpub esp8266 支付宝小程序 “{“power”:“false”,“blue”:50,“red”:50}” power为2个灯的状态,blue是蓝灯亮度值,red是蓝灯亮度值,范围都是 [0,100]


五、mqtt服务器搭建;


关于mqtt服务器搭建的要求,在支付宝小程序是没要求的,只要支持websocket就可以了,不像微信小程序那样严格必须是443 端口!而是任意端口,而我为了方便,依然是采用之前微信小程序接入的443端口!

所以,关于mqtt服务器搭建,以及如何反代理端口,请参考我之前的资料:

  • https://blog.csdn.net/xh870189248/article/details/84070944
  • https://www.bilibili.com/video/av39598869
  • https://blog.csdn.net/xh870189248/article/details/84070944

如果能力有限搭建失败麻烦,也欢迎加群,有提供免费的mqtt的服务器连接测试!


六、设备端代码部分讲解;


为了学习,我这里采用的是乐鑫最新的 rtos3.0分支上二次开发,意味要搭建 rtos3.0的环境,请自行搭建可参考我之前的博文:https://blog.csdn.net/xh870189248/article/details/81382279 。

而我的mqtt通讯采用的是乐鑫自研的框架esp-mqtt,在工程构建前请手动选择 mqtt组件为esp-mqtt,可以在 make menuconfig设置,否则会报错:fatal error: mqtt_client.h: No such file or directory (GIT8266O-144),请知悉!可以参考下面的 动态图:


我这里就不采用一键配网模式了,直接把路由器的账户密码写死在本地代码里面:


下面是连接服务器的配置,请替换为你自己的服务器配置参数!


下面是mqtt状态回调函数,实现的逻辑主要是如下:

  • 连接成功回调函数下开始订阅主题;
  • 服务器下发函数做自己的业务逻辑,这里的是异步进行的哈!下面的截图可以看到,是解析到了支付宝小程序下发的数据指令!


七、支付宝小程序代码部分讲解;


布局是必不可少的,这里很简单, 就是三个控件,样式代码就不贴了:


业务逻辑函数:

  • 其中的 sliderBlueCallBack() 函数是蓝色滑条的滑动回调函数!
  • 其中的 sliderRedCallBack() 函数是蓝色滑条的滑动回调函数!.
  • 工程一开始加载页面后回调函数onLoad()就开始连接服务器!


  • 最后得到的预览效果就是这样啦,还行啦!!


八 、后记;


  • 支付宝小程序是本人从集成mqtt协议开始到后面的通讯协议到控制esp8266的,而且协议和服务器搭建是花费蛮多时间的,最重要的是,这博文是花费几乎四个小时排版和编写,哈哈!各位能力强的朋友就参考我思路可以了,群里有些人要Bug我的代码,所以,我也就放在咸鱼了。需要的去看看吧!
  • 因为这个是我以后的面试作品,需要的就光顾下,价格绝对地便宜,不喜勿喷哈不喜勿喷哈!博文技术参考还是可以的!哈哈!!咸鱼APP扫描即可!骚扰者请不要扫描了啦,只求真诚交易!

支付宝小程序控制硬件②】 全网首篇,个人支付宝小程序控制智能硬件esp8266,从设计电路到设计协议控制两盏LED灯调节亮度。相关推荐

  1. 腾讯公测云开发低码!全网首篇实战评测

    听说腾讯的新产品『 云开发低码 』即将公测,怀着无比激动的心情,鱼皮立刻去官网申请并成功拿到了公测资格,然后使用它开发了一个小程序,并且通过 2020 Techo Park 开发者大会加深了对这项技术 ...

  2. 【TB-02模组专题⑤】微信小程序通讯TB02 模块控制 STM32 单片机LED灯

    本<安信可ble mesh蓝牙模组TB-02模组专题>系列博客学习由官方博客 CSDN安信可博客 潜心所力所写.如有不对之处,请留言,我们及时更改. 1.BLE MESH开发环境linux ...

  3. Esp8266进阶之路10 【小实战下篇】Windows系统搭建8266的本地Mqtt服务器,局域网点亮一盏LED灯。(带Demo)

    本系列博客学习由非官方人员 半颗心脏 潜心所力所写,不做开发板.仅仅做个人技术交流分享,不做任何商业用途.如有不对之处,请留言,本人及时更改. 序号 SDK版本 内容 链接 1 nonos2.0 搭建 ...

  4. Esp8266进阶之路⑨ 【小实战上篇】Windows系统搭建8266的本地Mqtt服务器,局域网点亮一盏LED灯。(带Demo)

    本系列博客学习由非官方人员 半颗心脏 潜心所力所写,不做开发板.仅仅做个人技术交流分享,不做任何商业用途.如有不对之处,请留言,本人及时更改. 序号 SDK版本 内容 链接 1 nonos2.0 搭建 ...

  5. HarmonyOS硬件创新合作伙伴,【HarmonyOS】HarmonyOS智能硬件开发学习指南 - HDC2020

    2020年9月10日,华为HarmonyOS 2.0版本正式官宣!这一次,借助 HarmonyOS 全场景分布式系统和设备生态,将定义全新的硬件.交互和服务体验,打开焕然一新的全场景世界,不愧是Har ...

  6. c语言程序设计林小茶,C语言第一篇概述林小茶

    <C语言第一篇概述林小茶>由会员分享,可在线阅读,更多相关<C语言第一篇概述林小茶(8页珍藏版)>请在人人文库网上搜索. 1.第一章,C,语言概述,1.1,程序与程序设计语言, ...

  7. 简述可编程控制器硬件组态及网络通信的核心思想_智能硬件设计报价诚信经营...

    智能硬件设计报价诚信经营,江苏创品工业设计有限公司,也是少数可以进行产品外观设计,结构设计,硬件软件设计,产线工艺设计及小批定制化生产服务的工业设计公司. 智能硬件设计报价诚信经营, AI-CPS O ...

  8. 鼎铛有耳 智能硬件供应链新一代“网红”诞生 ——第三届HCFT智能硬件供应链大会品牌盛会颁奖典礼在深成功举办...

    2016年10月21日,由慧聪电子网.慧聪LED网.慧聪智能硬件网主办的第三届HCFT智能硬件供应链大会暨品牌盛会在深圳大中华喜来登酒店盛大开启,来自智能硬件产业链上中下游的众多企业代表.专业买家,行 ...

  9. 高斯数据库gaussDB(DWS),全网首篇对标MySQL命令集合文章

    文章目录 创建高斯数据库 gaussDB(DWS) 连接 gaussDB(DWS) GaussDB (DWS) 命令学习 `\l`: 列出所有数据库 `\c 数据库名` :切换数据库 创建一个表 维护 ...

最新文章

  1. 标准模板库(STL)学习指南之map映射
  2. 笔记-信息系统安全管理-信息系统安全技术体系
  3. VTK:几何对象之OpenVROrientedCylinder
  4. 使用@Configuration注解来代替Spring的bean配置
  5. 怎么写出一份令人惊叹的设计文档?
  6. Java EE 8安全性API:概述
  7. android一个工程的xml怎么引用另外一个工程的xml,如何在Android中使用XML引用库中另一个包的字符串?...
  8. 构建嵌入式LINUX的NFS【ZT】
  9. GWmodel | 地理加权模型(Ⅱ-1):地理加权主成分分析(GWPCA)
  10. eclipse 中配置外部 tomcat 的debug
  11. windows上QT设置debugger的方法
  12. html页面缩小布局乱了为什么啊_PPT页面总是太空?这4个方法,让你的PPT增加亿点点细节!...
  13. python中0o10_Python中最常见的10个问题(列表)
  14. CAD图纸转换成高质量的彩色PDF格式如何操作?
  15. Windows10安装韩语输入法详细教程(图文)
  16. PLM( 产品生命周期管理)的简单介绍
  17. 8月第4周基金排行榜 | TokenInsight
  18. 占内存少的java开发工具_Java所占内存中神奇的64MB
  19. 计算机中十六乘十六进制怎么算,16进制的乘法怎么算
  20. Java中hashcode和equals详解

热门文章

  1. Motion Based Multi-Sensor Extrinsic Calibration源码配置与学习记录
  2. electron中使用 alert和comfirm等弹出框都会致使input无法获得焦点
  3. java:常见的日期转型,“Tue Oct 18 00:00:00 CST 2022“
  4. 视频 | 马云:如果有天阿里不在了,我们也要为世界留下这三样
  5. 夜访阿里总部:实拍双11背后神秘的程序员!
  6. 最全ARM体系结构知识:汇编、架构、异常级别和安全状态
  7. javax crypto IllegalBlockSizeException last block incomplet
  8. Day18JavaSE——Map集合Collections工具类集合案例练习
  9. 我的博客园博客开通了
  10. 微信小程序云开发沉浸式(透明)状态栏的实现(怎么写)