mirror of https://github.com/LCTT/TranslateProject.git synced 2024-12-26 21:30:55 +08:00

变更目录路径

2022-07-26 14:36:14 +08:00

9.1 KiB

Raw Blame History

为地铁站构建智能停车系统

本文将帮助你设计一个基于 Web 的应用程序，该应用程序使用 Node-RED 为地铁站的汽车自动实现智能停车系统。

Web应用程序是在Web服务器上运行的软件。终端用户通过Web浏览器访问每个Web应用程序。Web应用程序使用客户端—服务器架构进行编程，该架构是用户（客户端）通过可能由第三方托管的远程服务器提供服务。Web API(应用程序编程接口)在Web上可用，用户可以通过HTTP协议访问该接口，如图1所示。

本文将演示如何为地铁设计一个基于Web的汽车自动智能停车系统。它是使用开源的Node-RED设计。该系统使用模板节点创建了一个互动式且时尚的用户登录表单，该模板用HTML和CSS编码以获取车主详细，从而实现停车系统的自动化。我们可以在图2和图3看到登录表单和提交表单的流程图。

使用的节点如下：

地铁智能停车节点流程设计

Node-RED是使用’node-red‘命令激活。通过网址http://127.0.0.1:1880/ 可以访问Node-RED的用户界面流程图的浏览器。我们认为Node-RED设置已完成并且可以正常工作了。

按照下面给出的步骤创建登录表单和提交表单。

登录表单

在节点画布中，拖放http in节点，这会为创建Web服务创建一个HTTP访问点。
将http in节点连接到函数function节点。函数节点有助于编写JavaScripts函数处理节点接收到的消息。

将函数function节点连接到模板template节点，模板节点基于提供的模板创建一个Web API。
将模板template节点连接到http 响应response节点，响应节点将响应http输入节点的请求。

提交表单

拖放http in节点并将其连接到json节点，json节点将数据转换为JSON字符串进行通信。
将http in节点连接到调试debug节点，调试节点的调试监控器会输出结果。
将json节点放置并连接到函数function节点，将函数节点连接到http响应节点。

创建完整流程后，单击Node-RED窗口右上角的部署Deploy按钮。访问*127.0.0.1:1880/ui/*这个链接查看用户界面。

输入链接然后单击提交Submit后，该链接会跳转到下一页，您可以在该页面阅读所有新闻。

Node-RED工作流程

在单个Node-RED流程中，您可以创建登录表单和提交表单，如图4和图5所示。

现在我们将配置节点属性。

登录表单：编辑http in属性：方法method选择 ‘Get’，网址URL设为‘/MetroStation’ ，名称name配置为 “智能停车系统Smart Parking”。（译注：下文http响应节点的名称为Smart parking，p字母小写，为了区分，此处中文翻译成智能停车系统。）

-
注意：任何用户可以定义网址URL为本地变量。

现在选择函数节点，编辑函数节点属性：输入代码 ‘msg.url = project’ ，并配置代码名称name字段为 “项目提交Project Submission”。

在模板节点的属性窗口，为登录表单配置相应的HTML代码，并将代码名称name命名为 “显示面板Display panel”。猜此流程使用了Mustache（译注：Mustache是胡子的意思，因为它的嵌入标记{{ }}非常像胡子）模板格式。Mustache是一个简单的Web模板系统，被描述为无逻辑的模板引擎。Mustache没有任何显式的控制流语句，例如 ‘if’ 和 ‘else’条件和‘for’ 循环。可以通过使用块标签处理列表和lambdas来实现循环和条件评估。