首页 论坛 物联网专区 【连载】物联网全栈教程-从云端到设备

正在查看 15 帖子:16-30 (共 39 个帖子)
  • 参与人数:16 |  围观次数:9,060 
  • 朔风
    朔风 吃瓜群众

    期待零妖的视频,给零妖点赞,棒棒哒

     

    0零妖
    0零妖 瓜农

    物联网全栈教程-从云端到设备(十)

    上一篇文章零妖老哥已经通过一行代码即 bone init 初始化了一个默认的Web应用,通过执行另外一行代码 bone start 启动了本地的Web服务,并且可以通过谷歌浏览器来查看这个网页的效果。今天我们就去查找一些官方的帮助文档,然后根据提供的例程代码来修改为己用。
    有些坑零妖已经跳过了,所以就直接放出四个网址,里面都是干货。整个物联网弹幕器的项目中的Web应用所遇到的问题,都是通过浏览这四个网址来解决的。
    https://bone.aliyun.com/bone-web/bonewebsdk.html?name=wpgl7p Bone Web 的官方介绍
    https://bone.aliyun.com/bone-web/component.html UI组件的详细介绍
    https://viserjs.github.io/demo.html 数据可视化组件
    https://linkdevelop.aliyun.com/docCenter#/ 物联网设备相关的API说明
    注意:使用一些组件的时候,要先安装它们到电脑上。然后再修改package.json这个文件,把对这个组件的依赖添加进去,这样上传到服务器之后网页就会正常运行。具体方法零妖接下来会说。

    我们的目标是把设备上报的温度数据通过仪表盘的形式显示到网页上。在网页上显示一个仪表盘的代码最简单的做法就是去复制别人的代码然后简单修改一下啊。我们用到的其实是一个叫做“数据可视化”的组件,这个组件零妖认为在物联网项目中将会经常用到,因为大数据和物联网无非就是一些数据的交换和显示。
    进入 https://viserjs.github.io/demo.html#/gauge/basic-gauge ,查看React的官方例程代码。


    通过VSCode打开我们已经初始化好的那个Web应用,零妖是直接在桌面上新建了一个叫做 Web 的文件夹,里面就是全部需要的文件。用VSCode直接打开这个文件夹就算作打开整个项目了(其实你也可以用其他文本编辑器打开对应的文件)。然后打开index.js这个文件,我们将要重点编写它里面的代码。其他没有涉及的地方就不要管了,反正最后达到目的就行了。



    接下来开始复制官方代码,先让咱的网页上显示出一个和例程一模一样的仪表盘再说。

    写代码讲究一个“稳”字,咱们一步一步来,慎防粗心大意导致出错。先把要import的东西给复制过来,运行一下看看会不会出错。
    直接复制到index.js这个文件的前面,然后保存这个文件,打开“终端”,启动Web服务。详解见下图。


    结果就是,出错了。下图这个错误提示是谷歌浏览器直接显示的。

    遇到这种问题,唯一的解决方案就是安装这个组件。方法依然很简单,一行代码搞定。打开命令行,然后输入如下代码并回车即可完成 bnpm install –save viser-react 。如果你是安装别的组件,那么后面的viser-react换成别的组件的名字即可完成。

    好了,零妖已经教会你安装一个外部组件的方法了,如果你遇到了别的组件不是系统自带的,那么你就可以通过这种方法来安装,是不是很简单啊。你再保存一下index.js这个文件,键盘快捷键 Ctrl+s ,那么谷歌浏览器就会自动根据当前的代码进行刷新,如果不出意外这次肯定没问题了,不过显示的页面还是 Hello Bone 。


    一切OK之后,你就可以把 import 这部分内容之后的全部代码给删掉了,因为没有用啊,我们想要的是一个仪表盘。直接把仪表盘例程中,import之后的代码复制粘贴一下,然后保存文件,那么谷歌浏览器会自动刷新,见证奇迹吧!一个一模一样的仪表盘哦。

    然后你就不要怕犯错,不断猜测某个数值可能是什么意思,然后修改它观察显示效果,当然如果能参考官方说明最好,因为有的组件会做一个手册告诉你哪些参数是什么意思。这个过程是要靠你不断去实践探索的,光靠看书是没有用的。


    这篇文章你要靠自己勤劳的双手来完成一个仪表盘的显示,你自己要调整一下它的大小什么的,零妖就不在这里限制你的想象力了。
    其实我们更关心的是数据如何显示到上面。下一篇文章零妖就带你查看一下API的例程,读取设备的温度属性,然后想一个简单的方法显示到仪表盘上。

    嬉皮
    嬉皮 吃瓜群众

    麻烦请问一下MQTT单片机编程小工具 这个从哪里能下载到?同道中人,感谢感谢了

    0零妖
    0零妖 瓜农

    本连载文章所有涉及到的工具,软件包括网页代码有关的,单片机代码有关的,在连载文章结束后会全部上传到技新网对应板块的。因为有一个视频教程正在准备发布,所以这些小工具 我不敢提前发布,不要着急哈。

    0零妖
    0零妖 瓜农

    物联网全栈教程-从云端到设备(十一)

    千千万万的物联网设备通过ALink协议接入到了云端,它们不断地按照ALink协议的规范向云端汇报数据,同时也一直在等待服务器下发一些数据并处理这些数据。关于物联网设备端如何搞定这些数据,零妖老哥会在下一篇文章中以一个型号叫做STM32F103的单片机为例子进行硬件电路和程序代码的详细讲解,不要说你没有基础什么都不懂,你要是没有打开电脑上网的基础的话就关闭这篇文章吧(⊙o⊙ )。
    今天这篇文章零妖将告诉你云端怎么调用设备的数据。调用设备数据,给设备下发数据,获取设备当前是否在线等等,都是通过调用阿里云提供的API(相当于一个子函数,运行一下出一个结果那种)来实现的。我们就以一个API的使用方法为例子进行示范,起一个抛砖引玉的作用。


    零妖在上一章介绍了一种方法,在网页上显示了一个仪表盘,今天就来尝试一下将设备上报的温度数据显示到仪表盘上。
    在LinkDevelop平台中定义好一个产品后,你会得到一个产品的IoT-TSL(物的描述语言)。在云端看来,设备无非就是一串串符合ALink协议规范的JSON字符串。零妖老哥当初定义物联网弹幕器这个设备有两个属性,一个是温度,一个是弹幕。
    好了,我们的目标很明确了,我们要通过调用API的方式获取设备的一个属性,即获取温度这个属性。请你打开这个网址,找到 物的管理服务 里面的 获取物的指定属性快照数据 这个API的官方帮助文档。
    https://linkdevelop.aliyun.com/docCenter#/api/4

    然后就你就可以看到关于这个API的使用方法示例了,其实很简单,只需要修改一下他们例程里面的参数,然后通过例程上给的方法调用一下,就可以得到一个返回值,这个返回值里面会有一个参数就是我们想得到的温度属性的数值。


    撸起袖子开始抄!复制,粘贴!注意一下哈,这里面也import了一个东西,其实是导入了另外一个新的组件,名字叫做 @bone/linkdevelop-sdk ,你要自己安装一下。方法在零妖的上一篇文章中已经介绍了,不再说了啊。然后我们要修改里面的内容。你需要进入你的 测试设备 这个页面,读取两个参数如下图。这里得到的参数是 ProductKey 和 ProductSecret 。

    然后去 功能定义 里看一下温度属性的标识符:

    最后把上述得到的三个参数复制到代码里,替换原来的数值。



    上述代码中有一个地方是零妖自己琢磨了一会后发现的,就是修改仪表盘显示数值的那个变量。有个小技巧,先猜测某个变量最有可能是对应仪表盘显示的,然后修改这个变量,观察结果。(高级的我真的不懂了,谁让我是半路出家的竟会些歪门邪道。)
    告诉你一个很神奇的代码,能够提高调试代码的效率: console.log(this.Temperature); ,作用是在控制台输出this.Temperature这个变量的内容,你可以修改为任何你想查看的变量。
    零妖并不是特别擅长写“云上”这些代码,我只是告诉你一种方法来调用物的属性。其实如果你是专业的云端工程师,到这里就够了,你可以去开发你的代码了,不管你是基于哪个框架的哪种编程语言的,只要会调用API不就行了吗?

    最后,打开我们的MQTT客户端,模拟设备端发送一个数据过来。仪表盘同步变化了!

    阶段小结:如果你看到这里,其实就可以完成云端工程师的工作了。完全可以用MQTT客户端来模拟设备发送数据和接收数据,你就能调试云端和应用端的代码了。关于设备端的研发套路,零妖从下一篇文章开始介绍,主角是STM32F103C8T6这颗单片机!

    0零妖
    0零妖 瓜农

    阶段小结:如果你看到这里,其实就可以完成云端工程师的工作了。完全可以用MQTT客户端来模拟设备发送数据和接收数据,你就能调试云端和应用端的代码了。关于设备端的研发套路,零妖从下一篇文章开始介绍,主角是STM32F103C8T6这颗单片机!

    我已经把前11章的内容制作成为一个总的PDF文件了,非常适合做云端产品的朋友阅读,完全不用硬件就可以调试产品的应用程序,非常方便。需要的朋友加零妖QQ号聊聊吧,记得说你是在技新网看到的信息昂。QQ:1827702167    暗号:  上云

    0零妖
    0零妖 瓜农

    物联网全栈教程-从云端到设备(十二)

    经过前面的铺垫,你已经学会了在LinkDevelop上新建一个项目,然后通过使用MQTT电脑客户端模拟设备的方法来开发云端项目的代码。这波操作可以助你开发各类网页,手机APP等,但是脱离了硬件设备的支撑还能叫物联网吗?今天零妖就开始说设备端的开发,包括硬件电路的简单介绍和单片机代码的简单介绍。
    重磅消息:零妖老哥的项目中用到的所有硬件电路已经全部开源,地址在这里:
    https://lceda.cn/jixin N多开源硬件方案在这里
    https://lceda.cn/jixin002/stm32f103c8t6_cmsis-dap 单片机程序代码下载器,开源硬件
    https://lceda.cn/jixin/CH9121-4c2c4f99e2494eee8421dd23768820a1 以太网转串口模块
    https://lceda.cn/jixin002/1-5-oled_jx 1.5英寸彩色OLED模块
    https://lceda.cn/jixin001/wu-lian-wang-tan-mu-qi 物联网弹幕器核心板
    通过这个硬件开源平台,你可以直接把零妖的图纸复制走,然后再稍作加工修改为你自己的。


    首先要解决的头等大事就是如何连接到互联网。上网方法千千万万,零妖就选择了一个最传统但是又是最可靠的联网方式,以太网,俗称网线上网。对应的硬件就是CH9121以太网转串口模块,它的一端接上以太网,通过简单配置后就可以在另一端输出串口信号了,而且是透传。比方说你经过设置让你的模块通过TCP连接的方式连上了阿里云的服务器,那么你就可以通过操作串口来向服务器发送数据,以及接收来自服务器的数据了。
    今天零妖来做个小实验,通过串口操作来和阿里云服务器交换数据。首先要保证手里的CH9121模块已经通电,而且它的TXD1和RXD1接口和一个USB转串口模块已经连在一起了。这样你就可以在电脑上打开一个串口助手(比如技小新串口助手),来收发CH9121的数据了。要注意,串口通信的连线方法是交叉连接,比如两个串口设备要通信,那么A的TXD要和B的RXD连接,A的RXD和B的TXD连接。


    接下来要设置一下我们的CH9121模块,把它配置为一个TCP客户端,然后告诉它阿里云的服务器IP地址和端口号,再设置一下它的串口波特率,这样就OK了。插上网线后它就和我们的电脑同处一个局域网了,你需要打开一个电脑上位机来设置,这个电脑软件是生产CH9121的公司提供的,零妖会把它作为附件上传的。
    你先打开MQTT单片机编程小工具,输入测试设备的激活凭证后,再修改一下发送payload区域的标识符即可。如果你想单片机编程时直接使用,那就再点击一下,生成头文件吧。
    这里有一个步骤必须有,就是通过域名来获取IP地址,有一个简单办法就是PING这个域名。


    然后打开以太网透传模块CH9121的电脑配置软件,填写刚才得到的IP地址和端口号,如下图:

    OK,点击那个 配置设备参数 后,就会配置好CH9121模块,等它重启后就可以用了。
    CH9121上面有个蓝色TCPCS的LED灯,如果它亮了就表示和服务器建立了良好的TCP连接了,这个是判断你设置是否OK的最直接办法。


    好了,现在CH9121模块已经通过TCP的方式连接到了服务器了,你打开一个串口助手,准备发送一些数据来和服务器交流一下。发的数据还是通过MQTT单片机编程小工具生成的,你抓紧试一下。
    先发送一个叫做Connect的报文到服务器,它的作用是连接到服务器,看看你的设备是不是会上线。

    就是这么简单!设备已经成功连接到了服务器,接下来咱来试一下发送一个温度数据到云端。老办法,直接把属性上报的内容直接发出去,看一下服务器那边会不会有反应。


    你再试一下云端下发数据:



    经过上述实验,你是不是很惊喜?成功把和云端交互变成了一个串口的操作!单片机的上云之路从未这么简单!
    如果你是一个有经验的单片机工程师,那么你就可以不用往后看了,直接用这种办法去上云吧,你可以选择有AT指令的WIFI模组,或者GPRS模组等等方式上网,方法和零妖介绍的是一样的。
    下一篇文章零妖要开始介绍单片机STM32F103C8T6的使用方法了,从编译环境的搭建开始做起,一步一步的实现物联网弹幕器的功能!

    浪荡的~Man
    浪荡的~Man 吃瓜群众

    零妖大哥你好,请问MQTT单片机编程小工具在哪下载呢?

    0零妖
    0零妖 瓜农

    兄弟不要着急,按计划2018年6月初就会发布。

     

    0零妖
    0零妖 瓜农

    物联网全栈教程-从云端到设备(十三)

    很多朋友一听说要搞硬件总觉得还要重新学习很多电路基础知识,零妖告诉你这是个错误的想法。如果在十年前你这么想那么我是非常支持你的,但是在物联网时代你需要改变一下你的思维方式。作为一个设备开发工程师你需要做的是各种硬件资源的整合,比如你需要一个温度传感器那么你就去市场上购买一种即可,需要一个单片机那你就去技小新的开源硬件平台 https://lceda.cn/jixin 找一个你想要的复制粘贴,然后绘制PCB的时候保证你的电线是连通的即可。
    硬件是实现设备功能的躯壳,软件才是设备的灵魂!今天就教你安装一下编写单片机程序需要的软件,并示范一下将程序烧写进入单片机。


    和编写任何代码一样,掌握一个编写代码的工具使用方法是第一步。零妖使用的单片机的型号是STM32F103C8T6,它的内部用的是ARM的内核,想给它写程序有一个非常好用的工具叫做Keil5 。你需要上网下载一个MDK5.24A ,这是Keil5的另一个名字。然后再下载一个叫 Keil.STM32F1xx_DFP.2.2.0.pack 的器件支持包。这两个软件下载地址如下: https://www.jixin.pro/product/873.html


    安装软件之前你要做的是断开网络连接,这样有一个好处就是节约安装时间。安装完毕它会有一个自动升级,其实没啥用,断网之后就没办法自动升级了,节约你的宝贵时间。第一个安装的是Keil5这个软件,和安装电脑QQ一样,打开后一路 Next 即可,安装到默认的位置不用修改。这个没啥技术难度就不多说了。

    安装完毕之后会有一个错误提示,那就是断网导致的,你不用管它,打开软件即可。


    接下来要安装的就是那个STM32F1系列单片机的器件支持包,这个也很简单,如下图所示:


    到这里,Keil5这个软件就安装完毕了,以后的事情就是用它进行C语言的编写以及使用这个软件把代码烧写到单片机里面。

    先抛开代码不讲,假设代码已经写完了,接下来就需要编译和烧写,零妖这里做一个示范。

    接着,插上技小新的DAP烧写器(资料在这里,同样开源,你自己完全可以DIY一个:https://www.jixin.pro/product/3597.html )。根据它的说明连接好烧写器后,还需要在Keil5里面设置一下:


    看到了吧,硬件设计中的单片机编程部分,其实就是这么简单。下一篇文章零妖简单介绍一下C语言编程一个单片机,带你大致了解一下开发流程。

    0零妖
    0零妖 瓜农

    物联网全栈教程-从云端到设备(完结 十四)

    设备端的开发是一个非常简单的工作。零妖今天就简单讲解一下物联网弹幕器这个设备的源代码,给大家提供一个裸机上云的思路。连载文章更新到这里要告一段落,因为真的没啥要讲的了。


    首先要说的是使用技小新的MQTT单片机编程小工具生成一个C语言的头文件,这个在之前的文章里已经说过了。你的单片机要干的事情就是通过串口把这些16进制的数据发送给CH9121模块,然后CH9121模块会自动把这些数据打包一下以TCP的形式发送给服务器。



    单片机的串口资源真的非常好用。STM32F103C8T6这个型号的单片机有三个可以独立使用的串口资源,物联网弹幕器真正用的其实是两个,一个是串口1和电脑的串口连接,调试代码时候输出数据用的,一个是串口3用来和CH9121通信用的。在代码上你可以让串口1和串口3连接在一起,这样就可以在电脑上发送数据给CH9121了,实现的方法请看代码。

    在单片机的内部程序里,也是可以控制串口3发送任何数据的,所以就能发送小工具生成的数组到CH9121了。代码如下。


    从云端下发给设备的信息可能每次都不一样,比如说弹幕信息,每个人发送的都不一样那么单片机接收的数据长度就不一样,这需要你使用循环队列的方法来接收数据。首先你要预测一下云端一次性有可能下发数据的最大字节数,然后队列缓冲区的大小要是它的两倍以上。这样的处理可以非常有效的防止数据接收丢失的问题。


    为了示范物联网设备的数据上报流程,物联网弹幕器上面安装了一个温度传感器。这个温度传感器输出的是一个电压信号,这个电压的大小是和温度成正比例关系的。单片机能够通过一种叫ADC的方法来获取这个电压数值,然后就可以计算温度了。


    在开始做规划的时候,我从来没有认为显示一个汉字会是整个项目中最大的绊脚石。从网页上下发的弹幕信息是一个字符串,这个字符串是UTF8编码的,英文字母一切正常,但是涉及到汉字就一定会乱码,因为单片机这边按照往年经验直接做了GBK编码的处理。
    经过零妖老哥的不断摸索,终于发现了一个曲折的救国之路,就是先把UTF8编码转换为Unicode编码,然后再把它转化为能够显示再OLED上面的点阵信息,存到外部存储器里面,需要的时候就读取一下并显示出来。相关代码如下:


    好了,零妖老哥的物联网全栈教程分享到这里就结束了。感谢各位兄弟的支持和鼓励让我有动力连载完毕(坚持做一件事情真的好难)。尤其感谢阿里巴巴IOT事业部的同学提供技术上的帮助。
    有很多的想法和具体的细节是没办法在一个文章里写清楚的,为了能帮助更多的朋友快速上云,零妖把这个教程拍成了一个系列的视频教程,同时提供了物联网弹幕器的相关硬件(前面已经给了你开源地址,你完全可以自己做硬件哦)给想节约时间的工程师评估物联网项目使用。
    视频教程会在2018年6月初与大家见面: https://www.jixin.pro/courses
    教程涉及到的相关软件,资料,源代码,零妖会在2018年6月初一起开源给大家。
    不管你是做什么的,遇到技术上的难题咱俩可以单独讨论: QQ:1827702167
    暗号:上云

    写在最后:祝你抓住物联网市场的1%的机会!

    瑞虎
    瑞虎 吃瓜群众

    太赞了!!!把我带入了一个全新的世界,这篇文章对我来说就是灯塔啊。撸起袖子加油干!

    圆圆球球豆豆
    圆圆球球豆豆 吃瓜群众

    我是真的期待。

    WadeWww
    WadeWww 吃瓜群众

    如果换成esp8266就更好了。用wifi透传

    0零妖
    0零妖 瓜农

    看完这个教程之后,你就会发现,ESP8266直接透传没有一点问题!只要你把8266这边设置好和云端建立一个TCP连接即可。原理上都是相同的。

正在查看 15 帖子:16-30 (共 39 个帖子)

抱歉,回复话题必需登录。