可视化界面开发Node-RED【03】——框架介绍及数据流部署

Node-RED框架介绍及数据流部署

Node-RED介绍与登入功能等基础内容在前面已经介绍过了，今天我们就来学习开源可视化开发工具Node-RED具体框架介绍以及第一条数据流的部署。

1、界面框架介绍

数据流的编辑界面由四部分组成。最左边是已定义的各种node的列表，我们称之为控件区。中间是一个工作区，用户可以拖放node到工作区来创建node的实例，Node-Red为每个node实例赋予了唯一的ID，通过双击node实例来编辑单个实例，通过连接node的in和out创建数据流，node实例会记录out口连线的信息，每条线会记录目标node实例的信息最右边是debug node的输出区及node的帮助信息显示区。右上角有“部署”按钮，用来把编写的程序保存到本地并执行。

2、第一条数据流的部署

基本上所有与编程相关的教程总是喜欢从hello world开始，所以node-red第一条数据流的部署也从此开始。

（1）拖拽输入与输出节点：

进入Node-RED后将控件区内的输入节点“inject”与输出节点“debug”，使用鼠标左键拖入工作区内。拖入以后发现“inject”变成了“时间戳”，“debug”变成了“msg.payload”，这是正常现象。如果你的计算机或是树莓派运行在英文环境下，理所当然，工作区内的节点的名字会变成英文。

（2）更改节点配置：

双击时间戳节点，进入节点配置界面。

点击内容选项后的下拉菜单（小三角形），在菜单中选择文字列，并在输入框中输入“hello world”。

可以看到，此时“时间戳”节点名字显示成“hello world”。

（3）连接输入节点与输出节点：

在node-red中用“flow”来表示数据的流向，中文意思是“数据流”，即为数据从输入节点流向输出节点。使用鼠标按住左键，从上图接口1连接到接口2，即可完成输入输出的节点连接。用一条线连接输入输出节点，大概是最简单最直观的构建数据流的方式了。

（4）节点部署：

部署按钮位于界面右上角，下拉菜单有如下几项：

单击部署后，显示部署成功。

（5）调试：

时间戳节点左侧有一个小按钮，点击按钮可以手动注入消息，注入的消息为输入节点的文字列。在点击时间戳节点的按钮之前，必须确保debug节点是可用的，即按钮必须是“伸出来”的，如蓝框2，而不是像蓝框3一样“缩回去”，按钮“缩回去”的debug节点不工作。点击按钮可以切换节点是否工作。

点击时间戳节点左侧按钮发送消息，点击右上角调试窗口，即小爬虫按钮查看输出的消息。

3、手动编辑JSON格式输出

在时间戳节点中，输入的内容不仅可以选择输入文本列、数字等，还能以JSON格式输出，手动编辑JSON格式的代码即可通过JSON格式输出消息。

点击图中内容行蓝色框标出的三个点处，进入JSON编辑器。输入JSON格式代码：

输入后，点击格式化JSON可检测是否输入有误。完成后点击部署。点击时间戳左侧按钮，发送JSON格式消息，会在调试窗口显示图中消息。

免责声明：本文内容由21ic获得授权后发布，版权归原作者所有，本平台仅提供信息存储服务。文章仅代表作者个人观点，不代表本平台立场，如有问题，请联系我们，谢谢！