【微信小程序控制硬件第1篇 】 全网首发,借助 emq 消息服务器带你如何搭建微信小程序的mqtt服务器,轻松控制智能硬件!
【微信小程序控制硬件第2篇 】 开始微信小程序之旅,导入小程序Mqtt客户端源码,实现简单的验证和通讯于服务器!
【微信小程序控制硬件第3篇 】 从软件到硬件搭建一个微信小程序控制esp8266的项目,自定义通讯协议,为面试职位和比赛项目加分!
【微信小程序控制硬件第4篇 】 深度剖析微信公众号配网 Airkiss 原理与过程,esp8266如何自定义回调参数给微信,实现绑定设备第一步!
【微信小程序控制硬件第5篇 】理清接下来必须走的架构思想,学习下 JavaScript 的观察者模式,在微信小程序多页面同时接收到设备推送事件!
【微信小程序控制硬件第6篇 】服务器如何集成七牛云存储SDK,把用户自定义设备图片存储在第三方服务器!
【微信小程序控制硬件第7篇 】动起来做一个微信小程序Mqtt协议控制智能硬件的框架,为自己心里全栈工程师梦想浇水!!
【微信小程序控制硬件第8篇 】微信小程序以 websocket 连接阿里云IOT物联网平台mqtt服务器,封装起来使用就是这么简单!
【微信小程序控制硬件第9篇 】巧借阿里云物联网平台的免费连接,从微信小程序颜色采集控制 esp8266 输出七彩灯效果,中秋节来个直播如何?!
【微信公众号控制硬件 第10篇 】如何在微信公众号网页实现连接mqtt服务器教程!!
【微信小程序控制硬件 第11篇 】全网首发,微信小程序ble蓝牙控制esp32,实现无需网络也可以控制亮度开关。


文章目录

  • 一、前言;
  • 二、微信小程序 websocket;
  • 三、阿里云IOT物联网平台 websocket;
  • 四、如何移植和封装使用;
    • 4.1 为了简单实用,降低耦合,我一度封装起来生成的算法,其封装源码如下:
    • 4.2 如何使用呢?
  • 五、其他;

文章目录

  • 一、前言;
  • 二、微信小程序 websocket;
  • 三、阿里云IOT物联网平台 websocket;
  • 四、如何移植和封装使用;
    • 4.1 为了简单实用,降低耦合,我一度封装起来生成的算法,其封装源码如下:
    • 4.2 如何使用呢?
  • 五、其他;

一、前言;


今天是6月12号,高考过完刚刚不久,我也想起五年前那个夏天了。虽没有汗流浃背备考,但也有面对未来的种种幻想以及迷茫。

回想到现在工作了,自己学到的东西很多,还真的应了课本的一句话 “人的一生都是在学习中!学习如逆水行舟,不进则退!”,当我看到身边的一些人懒懒散散的,看博文学习不动手做小项目,我的心是有点 “嫌弃”的,我也希望在一个优秀的团队,可以彼此进步,不管是大型企业或者小公司!当身边的人优秀,你也会一定反思自己,有所行动。

感悟最深的是 ”学会投资自己“ ,不管在生活的衣食住行中,买些舒服的衣服,抑或是每天每周做些美食犒劳自己,还是在职业生涯中,买教程,买课本,消化知识,提升自己。总结我在网上买了几乎几千块的视频,其中也有些乏味的教学视频,也有很多实实在在的干货,的确耐人寻味,那是一种心灵上的快心。


二、微信小程序 websocket;


微信小程序都不陌生了,一句话:依靠在微信客户端的一个小程序,其开发语言不是原生的,而是采用 html+JavaScript+css 这样类似的前端代码,接近原生体验!

既然是一种类似 ”寄生虫“ 附属在微信客户端 ”宿主“ 里生存,那就不得不按照 ”宿主“ 的生存习惯,所以必须对于在微信小程序上实现 websocket连接阿里云IOT物联网平台服务器,那就必须遵循以下重要的准则:

  1. 连接的端口号必须是 443 ,必须是 https协议;这里采用原生的即可。
  2. websocket之上再实现 mqtt 协议数据发送和接受,即可实现以 mqtt 协议通讯;而我这里采用的是这个很出名的库:https://github.com/mqttjs/MQTT.js 来实现对数据的处理。

三、阿里云IOT物联网平台 websocket;


阿里云IOT物联网平台支持基于WebSocket的MQTT协议。您可以首先使用WebSocket建立连接,然后在WebSocket通道上,使用 MQTT 协议进行通信,即MQTT over WebSocket

  1. 证书准备。

WebSocket可以使用ws和wss两种方式,ws就是普通的WebSocket连接,wss就是增加了TLS加密。如果使用wss方式进行安全连接,需要使用和TLS直连一样的根证书。而我本次提供给大家的不需要根证书的。

  1. 连接说明:

    使用WebSocket方式进行连接,区别主要在MQTT连接URL的协议和端口号,MQTT连接参数和TCP直接连接方式完全相同,其中要注意securemode参数,使用wss方式连接时securemode=2,使用ws方式连接时 securemode=3。

    • 连接域名(服务器地址),华东2节点(即上海节点):
      ${YourProductKey}.iot-as-mqtt.cn-shanghai.aliyuncs.com:443

      其中 ${YourProductKey} 是个变量,请替换为您的产品key。

      Connect指令中需要设置 Keep Alive(保活时间)。保活心跳时间取值范围为30至1200秒。如果心跳时间不在此区间内,物联网平台会拒绝连接。建议取值300秒以上。如果网络不稳定,将心跳时间设置高一些。

      设备端在保活时间间隔内,至少需要发送一次报文,包括 PING 请求。

      如果物联网平台在保活时间内无法收到任何报文,物联网平台会断开连接,设备端需要进行重连。

    • MQTT连接参数参数如下:

      
      mqttClientId: clientId+"|securemode=3,signmethod=hmacsha1,timestamp=132323232|"
      mqttUsername: deviceName+"&"+productKey
      mqttPassword: sign_hmac(deviceSecret,content)sign签名需要把以下参数按字典序排序后,再根据signmethod加签。
      content=提交给服务器的参数(productKey,deviceName,timestamp,clientId), 按照字母顺序排序, 然后将参数值依次拼接
      

      其中,

      • clientId:表示客户端ID,建议mac或sn,64字符内。
      • timestamp:表示当前时间毫秒值,可选。
      • mqttClientId:格式中||内为扩展参数。
      • signmethod:表示签名算法类型。
      • securemode:表示目前安全模式,可选值有2 (wss协议)和3(ws协议)。
        参考示例,如果预置前提如下:
    clientId = 12345,deviceName = device, productKey = pk, timestamp = 789,signmethod=hmacsha1,deviceSecret=secret
    
    • 使用ws方式

      • 连接域名

        ws://pk.iot-as-mqtt.cn-shanghai.aliyuncs.com:443
        
      • 连接参数

        
        mqttclientId=12345|securemode=3,signmethod=hmacsha1,timestamp=789|
        mqttUsername=device&pk
        mqttPasswrod=hmacsha1("secret","clientId12345deviceNamedeviceproductKeypktimestamp789").toHexString();
        
    • 使用wss方式

      • 连接域名

        wss://pk.iot-as-mqtt.cn-shanghai.aliyuncs.com:443
        
      • 连接参数

        mqttclientId=12345|securemode=2,signmethod=hmacsha1,timestamp=789|
        mqttUsername=device&pk
        mqttPasswrod=hmacsha1("secret","clientId12345deviceNamedeviceproductKeypktimestamp789").toHexString();
        

四、如何移植和封装使用;


因为我做过设备端的 Mqtt协议连接阿里云物联网平台,对协议比较熟悉,所以对于怎么实现在微信小程序上是非常简单的。

上面已经详细地说明了阿里云物联网平台 websocket 的协议,那么总的来说就是一个 加密算法,因为我之前已经开源了一个在微信小程序上实现 Mqtt协议连接服务器,这只要拿到了连接的一些参数,那就不成问题了!

上面反复提到 hmacsha1 加密算法,那我就去找一个呗。还好,去官网 GitHub找了一个:点击访问 , 拿到了加密算法文件,按照上面说明,分别生成:mqttclientId、mqttUsername、mqttPasswrod、port端口号、url域名,就可以实现链接啦!


4.1 为了简单实用,降低耦合,我一度封装起来生成的算法,其封装源码如下:


exports.getAliyunIotMqttClient = function(opts) {//是否传入三元组if (!opts || !opts.productKey || !opts.deviceName || !opts.deviceSecret) {throw new Error('options need productKey,deviceName,deviceSecret');}if (opts.protocol === 'mqtts' && !opts.ca) {throw new Error('mqtts need ca ');}//是否传入区域if (!opts.host && !opts.regionId) {throw new Error('options need host or regionId (aliyun regionId)');}const deviceSecret = opts.deviceSecret;delete opts.deviceSecret;let secureMode = (opts.protocol === 'mqtts') ? 3 : 2;var options = {productKey: opts.productKey,deviceName: opts.deviceName,timestamp: Date.now(),clientId: Math.random().toString(36).substr(2)}let keys = Object.keys(options).sort();// 按字典序排序keys = keys.sort();const list = [];keys.map((key) => {list.push(`${key}${options[key]}`);});const contentStr = list.join('');//加密算法生成 passwordopts.password = crypto.hex_hmac_sha1(deviceSecret, contentStr);opts.clientId = `${options.clientId}|securemode=${secureMode},signmethod=hmacsha1,timestamp=${options.timestamp}|`;opts.username = `${options.deviceName}&${options.productKey}`;opts.port = opts.port || 1883;//生成域名opts.host = opts.host || `${opts.productKey}.iot-as-mqtt.${opts.regionId}.aliyuncs.com`;return (opts); //返回给上层
}

4.2 如何使用呢?


非常简单,只需要调用 getAliyunIotMqttClient(option) 传进一些参数即可获取全部东西;

option 对象的定义如下:

参数 含义
productKey 三元组信息 productKey
deviceName 三元组信息 deviceName
deviceSecret 三元组信息 deviceSecret
regionId 可选域,目前国内仅支持上海,所以是 cn-shanghai
port 443 不可修改,唯一!

返回的对象的定义如下:

参数 含义
clientId 连接参数
password 连接参数
username 连接参数
host 连接的域名
  • 示范:
data: {aliyunInfo: {productKey: 'a1o3SXAACTs23', deviceName: 'rgb2812',deviceSecret: 'RurAqmlt0duwMilKv6Oa856WDcQ279685a', regionId: 'cn-shanghai', }}var that = this//传进去三元组等信息,拿到mqtt连接的各个参数let clientOpt = aliyunOpt.getAliyunIotMqttClient({productKey: that.data.aliyunInfo.productKey,deviceName: that.data.aliyunInfo.deviceName,deviceSecret: that.data.aliyunInfo.deviceSecret,regionId: that.data.aliyunInfo.regionId,port: that.data.aliyunInfo.port,});//得到连接域名let host = 'wxs://'+clientOpt.host;this.setData({'options.clientId': clientOpt.clientId,'options.password': clientOpt.password,'options.username': clientOpt.username,})//开始连接this.data.client = mqtt.connect(host, this.data.options);this.data.client.on('connect', function(connack) {wx.showToast({title: '连接成功'})})

五、其他;


看起来是不是非常简单呢?对的,下面我已经传到了我 GitHub 仓库了,欢迎大家给个星星啦!是对我最大的支持! 我将一直维护:https://github.com/xuhongv/WeChatMiniEsp8266

更多的使用技巧,你需要具备一定的微信小程序开发经验哦!结合我的代码,让你轻松连接阿里云IOT物联网平台!与你共勉!!


  • 很多人怎么联系我一起学习进步,下面打个小小公告和干货无偿分享:

玩转esp8266 & esp32带你飞、加群付费QQ群,干货多多,提供免费Mqtt服务器,提高门槛,不喜的朋友勿喷勿加:434878850
esp8266源代码免费学习汇总(持续更新,欢迎star):https://github.com/xuhongv/StudyInEsp8266
esp32源代码免费学习汇总(持续更新,欢迎star):https://github.com/xuhongv/StudyInEsp32

【微信小程序控制硬件⑧ 】微信小程序以 websocket 连接阿里云IOT物联网平台mqtt服务器,封装起来使用就是这么简单!(附带Demo)相关推荐

  1. 支付宝小程序使用MQTT over WebSocket连接阿里云IoT物联网平台

    前言 之前写了一篇微信小程序使用MQTT over WebSocket连接阿里云IoT物联网平台,介绍了如何使用mqtt.js在微信小程序上连接mqtt服务器,文中顺带提了mqtt.js是支持支付宝小 ...

  2. 微信小程序使用MQTT.js连接阿里云IoT物联网平台

    官方已经开源了一个SDK版本,也是基于mqtt.js,进行了各种封装: https://github.com/aliyun/alibabacloud-iot-device-sdk · 阅读以下内容需要 ...

  3. 【小程序案例】支付宝小程序-MQTT模器,IoT设备通过WSS接入阿里云IoT物联网平台...

    支付宝小程序-MQTT模拟器通过WSS接入阿里云IoT物联网平台 准备工作 1.1 注册阿里云账号 开通阿里云账号,并通过支付宝实名认证 https://www.aliyun.com 1.2 免费开通 ...

  4. 阿里云企业物联网平台推出千里传音播报服务 高效打造云端一体智能硬件

    作为阿里云Cloud AIoT Native架构的基础平台,近日,阿里云企业物联网平台正式推出了IoT 云端一体应用--千里传音播报服务.该应用是阿里云AIoT针对带有语音播报能力的AIoT设备,提供 ...

  5. 【微信小程序控制硬件15 】 重认识无线物联网的配网协议,了解腾讯物联蓝牙协议LLSync SDK,腾讯连连小程序也可以蓝牙配网了。

    文章目录 一.配网的认识 1.1 各类Wi-Fi配网方式对比 1.2 设备热点配网 1.3 零配配网 1.4 蓝牙辅助配网 1.5 一键配网 1.6 手机热点配网 1.6 摄像头扫码配网 二.LLSy ...

  6. 微信小程序控制硬件第17篇 : 腾讯连连小程序通过LLSync蓝牙协议控制安信可PB-02模组,无需网络实现蓝牙本地通讯。(附带源码)

    文章目录 前言 一.注册腾讯物联开发平台设备 新建项目 新建产品 创建数据模板 选择设备开发方式 交互开发配置 新建设备 二.设备端操作 硬件简介与连接 准备软件环境 工程目录 烧录步骤 三.腾讯连连 ...

  7. 【微信小程序控制硬件13 】 与硬件平台无关,微信小程序 AP 配网安信可 Wi-Fi 模块入网示例。【AT篇,附带Demo】

    文章目录 前言 一 材料准备 二 实现目的 三 配置的数据交互协议 3.1 小程序发送网络信息阶段 3.2 模组连接路由器的回调: 四 配置原理和过程 五 设备端 AT 交互过程 另外,不要把我的博客 ...

  8. 【微信小程序控制硬件⑦ 进阶篇】巧借阿里云物联网平台的免费连接,从微信小程序颜色采集控制 esp8266 输出七彩灯效果,中秋节来个直播如何?!

    [微信小程序控制硬件第1篇 ] 全网首发,借助 emq 消息服务器带你如何搭建微信小程序的mqtt服务器,轻松控制智能硬件! [微信小程序控制硬件第2篇 ] 开始微信小程序之旅,导入小程序Mqtt客户 ...

  9. 【微信小程序控制硬件⑦ 进阶篇】动起来做一个微信小程序Mqtt协议控制智能硬件的框架,为心里全栈工程师梦想浇水。

    文章目录 一.前言: 二.涉及的技术点: 三.框架的运行原理: 四.框架代码流程: 4.1 主线程: 4.2 获取设备列表显示设备,以及订阅在线的设备: 4.3 点击某设备如何实现携带此设备信息到控制 ...

最新文章

  1. 【文本分类】混合CHI和MI的改进文本特征选择方法
  2. php文件数组,从文件到数组php
  3. Spring Boot 添加拦截器的配置方式
  4. 手把手Tinyxml入门,C++ VS2010
  5. day3 python 函数
  6. 爬虫笔记:爬虫的基本原理
  7. C语言形参跟实参详解
  8. oracle索引大小暴增_oracle海量数据中提升创建索引的速度
  9. 基于MATLAB的数字水印技术实现解析
  10. 集合源码解析Map容器Gc回收算法
  11. 清华大学2019年“全国优秀中学生信息学冬季体验营”报名通知
  12. 2021年IT互联网高薪职位大盘点
  13. Node.js 静态web服务
  14. 如何用计算机算p,‎App Store 上的“计算器++P”
  15. Spring依赖注入的方式、类型、Bean的作用域、自动注入、在Spring配置文件中引入属性文件...
  16. 大学计算机基础2014,2014《大学计算机基础》课程学习手册(学生).pdf
  17. springboot 秒杀系统(二)redis
  18. python-networkx库的使用1
  19. 业界最快的高转速马达,追觅科技V12无线吸尘器
  20. 苏州弗迈姆工业科技有限公司简介

热门文章

  1. VC调试器高级应用----系统函数,DLL段点
  2. 航天生物计算机作文,我与航天作文
  3. 项目一:《小米官网》
  4. 与Linux(小企鹅)服务器相关资料(一)
  5. SystemVerilog—Timescale解析
  6. Python零基础入门之第一章(一、基本输入和输出)
  7. C语言编程求三位数各位之和,C趣味程序(二)(04)求三位阶乘和数
  8. matlab模型求解
  9. TDSQL:从自主可控金融级数据库看腾讯“智能+”技术中台之路
  10. 腾讯智慧校园 php,【腾讯智慧校园V1.35】版本更新