前言
本文主要介绍如何在 Node-RED 中使用 node-red-contrib-datakitjs 这个 npm 包，该包可以方便地将数据通过 WebSocket 实时传输到前端页面，为前端数据可视化提供支持。
安装
在 Node-RED 根目录下通过 npm 安装该包：
--- ------- --------------------------
使用
在 Node-RED 中添加 node-red-contrib-datakitjs 节点。
在该节点的设置中，输入 WebSocket 服务的地址和端口号，如
ws://localhost:8080。将需要传输的数据发送到该节点，可以使用 inject 节点模拟数据输入。数据格式为 JSON，如：
- ------ ------- -在前端页面中引入 datakitjs：
------- -------------------------------------
在页面中创建一个 DataKit 实例：
--- ------- - --- ----------
向 DataKit 实例中添加服务器地址和端口号：
-----------------------------------------
启动 DataKit 实例：
----------------
在 DataKit 实例中添加监听器，监听数据的变化：
---------------------------------- - ------------------ ---当有新数据传输时，页面中的 console 将输出该数据。
示例代码
Node-RED 节点
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
前端页面
--------- -----
------
------
-------------- ---------------
------- -------------------------------------
-------
------
--------
--- ------- - --- ----------
-----------------------------------------
----------------
---------------------------------- -
------------------
---
---------
-------
-------总结
node-red-contrib-datakitjs 使得数据通过 WebSocket 实时传输到前端变得非常简单，为前端数据可视化提供了很大的便利。使用该包需要了解 Node-RED 和 WebSocket 的相关知识，同时需要掌握一定的前端编程技巧。希望这篇教程对大家有所帮助！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600572c481e8991b448e8ded