Node-RED Dashboard 使用教程
1. 项目介绍
Node-RED Dashboard 是一个为 Node-RED 设计的实时数据仪表盘 UI 模块。它提供了一组节点,可以快速创建一个实时数据展示的仪表盘。该模块基于 Angular v1 开发,支持 Node.js 12 及以上版本。尽管 Angular v1 已经不再维护,但该项目仍提供“生命支持”,即小修小补,但不进行重大功能升级。
2. 项目快速启动
安装
- 打开 Node-RED,进入“管理面板”。
- 在“管理面板”中搜索
node-red-dashboard。 - 点击安装。
或者,你也可以在 Node-RED 的用户目录下运行以下命令进行安装:
npm i node-red-dashboard
启动
安装完成后,重启 Node-RED 实例。你将在左侧的节点面板中看到新的 UI 节点,同时在右侧的侧边栏中看到一个新的“仪表盘”选项卡。
配置
默认情况下,仪表盘的 URL 是基于 Node-RED 的 httpRoot 路径,并在其后添加 /ui。例如,如果 Node-RED 运行在 http://localhost:1880,那么仪表盘的 URL 将是 http://localhost:1880/ui。
你可以在 Node-RED 的 settings.js 文件中进行配置,例如:
ui: {
path: "ui",
middleware: function (req, res, next) {
console.log('LOGGED');
next();
}
}
3. 应用案例和最佳实践
应用案例
Node-RED Dashboard 可以用于各种实时数据展示场景,例如:
- 智能家居控制面板:展示和控制家庭中的各种设备状态,如灯光、温度、湿度等。
- 工业监控系统:实时监控生产线上的各种参数,如温度、压力、速度等。
- 物联网设备管理:展示和管理连接到网络的各种物联网设备的状态和数据。
最佳实践
- 使用多个组:为了更好地适应不同屏幕尺寸,建议使用多个组而不是一个大组,以便页面能够动态调整布局。
- 自定义主题:通过设置自定义主题,可以使仪表盘更符合你的品牌或个人风格。
- 使用中间件:通过配置中间件,可以对 HTTP 请求和 WebSocket 连接进行自定义处理,增加安全性和功能性。
4. 典型生态项目
Node-RED Dashboard 作为 Node-RED 生态系统的一部分,可以与其他 Node-RED 节点和模块结合使用,例如:
- node-red-contrib-ui:提供额外的 UI 组件和功能,增强仪表盘的展示能力。
- node-red-contrib-chartjs:集成 Chart.js,提供更丰富的图表展示功能。
- node-red-contrib-web-worldmap:用于在地图上展示位置数据,适用于物联网设备的地理位置监控。
通过这些生态项目的结合,可以构建出功能更加强大和多样化的实时数据展示系统。
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考



