介绍

最近物联网应用一直很火,也打算做一些这方面的尝试,就边学边做在家花了2天时间做了一个简单demo,功能很简单,使用emq x 作为mqtt broker,用python写了一个定时抓取主机CPU利用并发布消息,用微信小程序和VUE客户段订阅消息并实时监控CPU使用情况,场景非常的简单,就是一个订阅/分发的过程,使用任何的MQ产品都能实现,但不同的mqtt协议相对与其它的mq产品更轻量级,同时也是专为物联网应用设计的,所以用起来更方便.随便也把过程遇到的一些问题说明一下,也可以让想了解和尝试的小伙伴有一个参考.

先看一下做出来的效果

总之使用mqtt协议做起来就是快,简单!

开发环境准备

这次demo使用的大多数组件都是国产开源的产品,国产软件进步非常大.

开发工具:vs code,微信小程序开发工具

运行环境:python 微信小程序 ,vue

组件:

  mqtt broker(emqx broker) 基础版免费开源 https://www.emqx.io/ 非常好用,功能也非常强大,网上都能找到很完善的文档

  antv/f2 https://f2.antv.vision/en 图表组件,echarts感觉千年不变的样式有点lower,还是阿里产品好,虽然参数都差不多,但是还是有差别,很难一个人都能完全掌握,要做图表我就选antv了

mqttjs https://github.com/mqttjs  js mqtt 客户端

paho-mqtt  安装 命令 conda install -c sci-bots paho-mqtt mqtt python 客户端

  apscheduler 安装 命令 conda install -c conda-forge apscheduler python  客户端

源代码

  代码就不贴了,可以自己分去下载

https://github.com/neozhu/mqtt_tutorial   https://github.com/neozhu/mqtt_tutorial.git

问题&解决

 配置emq x服务端 mqtt broker,为了与微信小程序通讯,必须开启SSL和wss,也就是这里必须要配置证书,如果用自签名的证书可能会比较麻烦,存在根证书信任问题,我这边是用腾讯云主机并申请了域名和证书,所以配置起来很简单,如果没有的小朋友一定要注意自签名证书生成规则
   微信小程序中应用mqttjs不能使用npm install mqtt -save 网上找了很多还是没能解决,所以我是直接从网上下载后手工加载使用的,如果你可以用npm安装的请告知一下,谢谢. 但在vue项目中就没问题
   微信小程序中连接mqtt 必须使用 wxs前缀对应的就是wss,但微信小程序就不允许用wss或是ws,所以要测试,你的mqtt broker必须开启ssl
   微信小程序中使用antv/f2组件必须安装 npm install @antv/wx-f2 --save  https://github.com/antvis/wx-f2 
   VUE中使用antv/f 初始组件的必须写在 mounted() 方法下,写其他地方也会报错

小小的总结

mqtt在多种终端之间实现实时通讯确实非常方便,特别是物联网这块.

作为一名.net程序员,开发VUE,微信小程序确实有点力不从心,特别是对UI布局调整,一个页面有70%-80%时间花费在了页面布局上.

pyhon确实好用,资源感觉比c#还多,但还是不熟练,特别是模块化开发还真不知道如何是好.

开来2020年必须要转型做全栈开发了.

   

  

最新文章

  1. .net erp(办公oa)开发平台架构概要说明之表单设计器
  2. Maven实战系列文章
  3. c++ boost asio库初学习
  4. 打造Orm经典,创CRUD新时代,Orm的反攻战
  5. Android targetSdkVersion 对生命周期的影响
  6. hibernate中保存一个对象后再设置此对象的属性为什么不需要调用update方法了
  7. HOST ip is not allowed to connect to this MySql server
  8. codeforces #232 div2 解题报告
  9. 使用Python脚本进行域名解析
  10. BZOJ_1623:_[Usaco2008_Open]_Cow_Cars_奶牛飞车_(贪心)
  11. git clone之后自动checkout文件处理
  12. 201521123115 《Java程序设计》第12周学习总结
  13. [Spark内核] 第37课:Task执行内幕与结果处理解密
  14. 从__acrt_first_block == header 谈起,记录dll链接不一致的问题
  15. 023_System Integrity Protection in macos
  16. 百度编辑器 ueditor 会屏蔽过滤 body html head DOCTYPE ... 的解决办法
  17. GetAsyncKeyState()& 0x8000
  18. Ural 1039 Anniversary Party
  19. 【原创视频教程】XSL视频教程[共9集]
  20. SimpleXML概述

热门文章

  1. JavaScript 数组去重和对象相等判断
  2. jq css()
  3. 数据存储在哪里? Java是值传递还是引用传递?
  4. Adam那么棒,为什么还对SGD念念不忘 (3)—— 优化算法的选择与使用策略
  5. mysql 第一课 win7艰难的配置与删除注册表重新安装
  6. 如何让索引只能被一个SQL使用
  7. 【t002】jam的计数法
  8. windows命令行下redis读取中文字符乱码
  9. linux主次编号
  10. 手机网页H5 自适应不同分辨率的屏幕 必学标签meta之viewport