当前位置：首页 > news >正文

NodeRed使用心得，实现增删改查等

news 来源：原创 2025/5/15 14:36:17

使用场景介绍

在VUE中使用nodeRed实现对节点的增删改查等功能，且储存成功之后下点击时启动对应流程

在这里插入图片描述

安装与配置

1.安装NodeRed
npm install -g --unsafe-perm node-red
安装完成后，你可以通过运行以下命令来启动Node-RED
node-red-start2. 配置文件
Node-RED的主要配置文件是settings.js。这个文件位于Node-RED的安装目录下，或者在你的用户目录下的.node-red文件夹中。你可以通过编辑这个文件来自定义Node-RED的行为。

首先就是部署了，要真正的实现且储存成功之后下点击时启动对应流程还是要麻烦后端同学部署一下(具体如何部署我也不清楚)
后端部署之后会提供一个地址如:

http://192.168.1.19:1880/#flow/ff07562cd6ebb566
http://192.168.1.19:1880 为后端提供的地址，ff07562cd6ebb566为当前流程的ID已启动对应的流程

拖动一些节点右上角后点击部署后，会自动存储一个json文件

[{"id": "8587ac557a88ac60",//流程ID"type": "tab","label": "流程 2", //流程名称"disabled": false,"info": "","env": []},{"id": "de312079982d37a9","type": "debug","z": "8587ac557a88ac60","name": "debug 3",//节点类型"active": true,"tosidebar": true,"console": false,"tostatus": false,"complete": "payload","targetType": "msg","statusVal": "","statusType": "auto","x": 1000,//节点位置"y": 300,//节点位置"wires": []},{"id": "b3f87d7d2496d6b3","type": "http request","z": "8587ac557a88ac60","name": "Get News Details","method": "GET","ret": "obj","paytoqs": "ignore","url": "http://shop.pulisi.sd.cn:8088/pleaseds/stationlist?strwhere=","tls": "","persist": false,"proxy": "","insecureHTTPParser": false,"authType": "","senderr": false,"headers": [],"x": 370,"y": 360,"wires": [["6f54cda79df1511a"]]},{"id": "10a4b6f9d7cb092c","type": "inject","z": "8587ac557a88ac60","name": "","props": [{"p": "payload"},{"p": "topic","vt": "str"}],"repeat": "","crontab": "","once": false,"onceDelay": 0.1,"topic": "","payload": "","payloadType": "date","x": 110,"y": 300,"wires": [["b3f87d7d2496d6b3"]]},{"id": "6f54cda79df1511a","type": "function","z": "8587ac557a88ac60","name": "function 3","func": "\nreturn msg;","outputs": 1,"timeout": 0,"noerr": 0,"initialize": "","finalize": "","libs": [],"x": 680,"y": 360,"wires": [["de312079982d37a9"]]}
]

代码演示增删改查

在以上完成安装部署存储等就可以进行编程了（完整代码我会贴在我的雨雀笔记！毕竟是公司代码需要一些保密）

查询出对应节点

  getlist() {axios.get('http://192.168.1.19:1880/flows') 这里是替换你后端的api.then(res => {console.log(res, 'res');// 将API返回的数据（res.data）进行过滤和映射处理，生成一个新的数组赋值给this.SceneLinkageListthis.SceneLinkageList = res.data// 过滤出type为'tab'且label存在的项.filter(item => item.type === 'tab' && item.label)// 对过滤后的每一项进行映射，生成新的对象数组.map(item => ({// 新对象的id属性，取自原项的idid: item.id,// 新对象的label属性，取自原项的labellabel: item.label,// 新对象的description属性，取自原项的info，如果info不存在则默认为空字符串description: item.info || '',// 新对象的status属性，根据原项的disabled属性决定，如果disabled为true则为'disabled'，否则为'enabled'status: item.disabled ? 'disabled' : 'enabled'}));// 将处理后的SceneLinkageList数组复制一份给filteredSceneLinkageList，用于后续的过滤显示this.filteredSceneLinkageList = [...this.SceneLinkageList]; }).catch(error => {console.error('请求失败:', error);});},

启动对应流程
将上一步的json数据保存后渲染到页面后点击时传值

launchNodeRED(rule) {console.log(rule, 'rule');if (!rule.id) {console.error('该规则没有关联的流程 ID');this.$message.error('无法启动流程：未指定流程 ID');return;}if (this.currentNodeREDWindow && !this.currentNodeREDWindow.closed) {this.currentNodeREDWindow.close();}const nodeREDUrl = `http://192.168.1.19:1880/#flow/${rule.id}`;console.log('Node-RED URL:', nodeREDUrl);try {this.currentNodeREDWindow = window.open(nodeREDUrl, 'nodeREDWindow');if (!this.currentNodeREDWindow) {throw new Error('弹出窗口被阻止');}} catch (error) {console.error('打开 Node-RED 流程失败:', error);this.$message.error('启动流程失败，请检查您的浏览器设置');}
},

删除

axios.delete(http://192.168.1.19:1880/flow/${rule.id});

新增与编辑
async submitForm() {
try {
const valid = await this.$refs.ruleForm.validate();
if (!valid) return;

    if (this.dialogTitle === '新增规则') {const response = await axios.post('http://192.168.1.19:1880/flow', {label: this.formData.name,info: this.formData.description,nodes: []});const newFlow = response.data;this.SceneLinkageList.push({id: newFlow.id,label: newFlow.label,description: newFlow.info,status: 'enabled'});this.$message.success('新流程创建成功');this.launchNodeRED({ id: newFlow.id });} else {const response = await axios.get(`http://192.168.1.19:1880/flow/${this.formData.id}`);const flow = response.data;flow.label = this.formData.name;flow.info = this.formData.description;await axios.put(`http://192.168.1.19:1880/flow/${this.formData.id}`, flow);const updatedRule = this.SceneLinkageList.find(rule => rule.id === this.formData.id);if (updatedRule) {updatedRule.label = this.formData.name;updatedRule.description = this.formData.description;}this.$message.success('规则修改成功');}this.dialogVisible = false;this.getlist(); // Refresh the list after adding or editing} catch (error) {console.error('提交表单失败:', error);this.$message.error('操作失败，请重试');}
},

这里只做简单的介绍，看不懂把代码喂给AI他也能给你解答

如何在nodeRed中运行想要的结果

关于noderRed如何配置节点并运行？
在这里插入图片描述

1.首先需要一个能触发的节点如 inject 拖到画布中
2.配置HTTP节点，自定义调整请求方式 URL地址返回值等无需过多配置
3.配置function放(可省略)
4.debug节点打印输出的内容
5.将他们如图依次连接后，点击部署后，点击 inject 左侧按钮即可打印接口返回的结果
在这里插入图片描述

如何个性化配置nodeRed

nodeRed下载后网页标题与页面标题都是初始化的
在这里插入图片描述
如果要修改则需要去nodeRed安装目录找到settings.js文件

如何找到nodeRed安装目录？常见的默认安装目录：
- Windows: `C:\Users\[用户名]\.node-red`
- Linux: `/home/[用户名]/.node-red`
- Mac: `/Users/[用户名]/.node-red`

找到后打开文件找到 editorTheme: {}在这个里面添加你要的值，如

 page: {title: "规则设计器"},header: {title: "规则设计器"},

最后就是安装个性化插件以及设置语言，设置中皆可自定义调整
在这里插入图片描述

NodeRed使用心得，实现增删改查等

使用场景介绍在VUE中使用nodeRed实现对节点的增删改查等功能，且储存成功之后下点击时启动对应流程安装与配置 1.安装NodeRed npm install -g --unsafe-perm node-red 安装完成后，你可以通过运行以下命令来启动Node-RED node-red-start2. 配置文件 N…...

编程日记 2025/5/15 14:36:17

万物皆有解法（序）

万物皆有解法（序） 《万物有解》一：解的存在解：可做解释解答，此文引申为原因。可做解除、解围，此文引申为解法、方法。先有事物存于世-what，再有原因为何存-why，再有解法如何除去…...

编程日记 2025/5/4 15:15:02

OpenCV相机标定与3D重建(37)计算两幅图像之间单应性矩阵（Homography Matrix）的函数findHomography()的使用

操作系统：ubuntu22.04 OpenCV版本：OpenCV4.9 IDE:Visual Studio Code 编程语言：C11 算法描述找到两个平面之间的透视变换。 cv::findHomography 是 OpenCV 库中用于计算两幅图像之间单应性矩阵（Homography Matrix）的…...

编程日记 2025/5/9 0:51:24

从虚拟到现实：AI与AR/VR技术如何改变体验经济？

引言：体验经济的崛起在当今消费环境中，产品与服务早已不再是市场竞争的唯一焦点，能够提供深刻感知和独特体验的品牌，往往更能赢得消费者的青睐。这种转变标志着体验经济的崛起。体验经济不仅仅是简单的买卖行为，而是通…...

编程日记 2025/5/15 0:12:35

Linux系统之stat命令的基本使用

Linux系统之stat命令的基本使用一、stat命令介绍二、stat命令帮助2.1 查询帮助信息2.2 stat命令的帮助解释三、stat命令的基本使用3.1 查询文件信息3.2 查看文件系统状态3.3 使用格式化输出3.4 以简洁形式打印信息四、注意事项一、stat命令介绍 stat 命令用于显示文件或文…...

编程日记 2025/5/10 2:03:50

c++ 命名空间

目录目录目录 namespace的定义代码演示先使用全局域，再使用namespace定义出的域命名空间中可以定义变量/函数/类型等命名空间可以嵌套 namespace的使用指定命名空间访问 using将命名空间中某个成员展开展开命名空间中全部成员在c中，由…...

编程日记 2025/5/10 6:34:55

【实验记录】动手实现一个简单的神经网络实验（一）

最近上了“神经网络与深度学习”这门课，有一个自己动手实现调整神经网络模型的实验感觉还挺有记录意义，可以帮我巩固之前学习到的理论知识，所以就打算记录一下。实验大概是使用LeNet（卷积神经网络）对MINIST数据集做图…...

编程日记 2025/5/14 20:38:56

【2024年最新】BilibiliB站视频动态评论爬虫

废话不多说，直接先放git仓库：GitHub - linyuye/Bilibili_crawler: bilibili爬虫，基于selenium获取oid与cookie，request获取api内容〇：概念简述 oid：视频/动态的uuid，b站对于发布内容的通用唯…...

编程日记 2025/5/15 2:22:29

清空DNS 缓存

如果遇到修改了host文件，但是IP和域名的映射有问题的情况，可以尝试刷新DNS缓存。 ipconfig/flushdns win建加R建，然后输入cmd，然后回车然后回车，或者点击确定按钮。出现如下所示标识清空DNS 缓存成功。...

编程日记 2025/5/3 9:04:43

东土智能交通服务器助力北京市车路云一体化建设

背景及意义北京高级别自动驾驶示范区自2020年启动建设，至今已经发展建设到3.0阶段，通州区作为3.0阶段扩建的重点区域之一，扩区建设范围共计约175平方公里，涉及18个属地街镇，涵盖580个路口。作为北京市车路云一体化…...

编程日记 2025/5/15 12:47:44

HarmonyOS NEXT 实战之元服务：静态案例效果---妙语集语

背景： 前几篇学习了元服务，后面几期就让我们开发简单的元服务吧，里面丰富的内容大家自己加，本期案例仅供参考先上本期效果图 ，里面图片自行替换效果图1完整代码案例如下： import { authentication } …...

编程日记 2025/5/10 15:44:15

1.联系人案例 # 导入的模块 from input_util import * import re import csv# 定义一个变量保存文件读取的信息 users {}# 封装读取文件的函数 def reader_file(path_name: str ./python基础/2024-11-15python基础项目/data/a.csv) -> None:try:with open(path_name, enco…...

编程日记 2025/5/14 13:50:47

mysql返回N/A

在写统计图的接口，sql查询一直无数据，给的默认值也没有实现： SELECTifnull( unit.num, 0 ) riskUnitCount,ifnull( EVENT.num, 0 ) riskEventCount,ifnull( measure.num, 0 ) riskMeasureCount FROMtb_companyLEFT JOIN (SELECTrisk.qyid,co…...

编程日记 2025/5/14 11:36:10

C++---------迭代策略与迭代器

一、迭代策略与迭代器迭代器的概念迭代器是一种对象，它提供了一种统一的方式来访问容器（如数组、向量、列表等）中的元素，而不暴露容器的内部结构。迭代器的行为类似于指针，可以用于遍历容器中的元素、修改元素以及…...

编程日记 2025/5/14 1:56:31

深入解析 Oracle 的聚合函数 ROLLUP

目录深入解析 Oracle 的聚合函数 ROLLUP一、ROLLUP 函数概述二、ROLLUP 函数语法三、ROLLUP 实例详解（一）基础分组聚合（二）引入 ROLLUP 函数（三）ROLLUP 与 NULL 值（四）多列复杂分组…...

编程日记 2025/5/14 21:15:35

kipotix4靶机实战

信息收集 1.判断靶机ip 原理：开靶机之前nmap扫一次网段，再开靶机之后扫一次，查看多出来的ip就是靶机ip ip192.168.98.1742.判断端口服务，系统版本 a.确定端口 b.-p指定端口进一步收集 c.信息筛选 1.端口：22,80,139,…...

编程日记 2025/5/12 18:00:18

Java中处理if-else的几种高级方法

前言在我看来多写几个if-else没啥大不了的，但是就是看起来没啥逼格，领导嫌弃。我根据开发的经历写几个不同的替代方法一、枚举法替代我先前写了一篇文章，可以去看看。通过枚举替换if-else语句的解决方案_枚举代替if else c语言-CSDN博…...

编程日记 2025/5/14 23:25:41

LaTeX 是一种基于标记的排版系统，广泛用于创建高质量的文档，特别是在需要复杂数学公式、表格、文献引用等的场景中

LaTeX 是一种基于标记的排版系统，广泛用于创建高质量的文档，特别是在需要复杂数学公式、表格、文献引用等的场景中。以下是关于 LaTeX 的详细解释： 1. LaTeX 的基本概念本质：LaTeX 是基于 TeX 的排版系统，提供了更高…...

编程日记 2025/5/14 17:27:17

Go入门篇：（一）golang的安装和编辑工具安装

一、前言最近我有幸接触到Go语言，深入了解后，发现go语言确实有很多让人惊叹的地方。作为一个有着多年Java编程经验的程序员，我深深地被它所吸引，并且决定记录下我的学习之路，以便与大家分享我的经验和感悟。与Java不同，Go语言的语法和运行效率都非常高，特别是对于并…...

编程日记 2025/5/14 10:57:25

【10】Selenium+Python UI自动化测试邮件发送测试报告（某积载系统实例-04）

测试报告需要发送给相关人员，但每次都要在report目录下去复制太麻烦，可以使用邮件模块自动将生成的报告发送给相关人员 1、新增utils文件夹，用于存放工具文件在utils下新增sendmail.py文件代码 sendmail.py import smtplib from email.…...

编程日记 2025/5/12 0:10:18

Playwright爬虫xpath获取技巧

示例一 <button class"MuiButtonBase-root MuiButton-root MuiLoadingButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeLarge MuiButton-containedSizeLarge MuiButton-colorPrimary MuiButton-fullWidth MuiButton-root MuiLoadingButton…...

编程日记 2025/5/12 21:21:44

运算符 - 算术、关系、逻辑运算符

引言在编程中，运算符是用于执行特定操作的符号。C 提供了多种类型的运算符，包括算术运算符、关系运算符和逻辑运算符等。理解这些运算符及其用法对于编写高效且无误的代码至关重要。本文将详细介绍 C 中的这三种基本运算符，并通过实例帮助读…...

编程日记 2025/5/13 23:48:04

中关村科金外呼机器人智能沟通破解营销难题

当今，传统的营销方式在效率、成本控制、客户管理等方面逐渐显现出局限性，难以满足现代企业的需求。如何提升营销效率、降低运营成本、有效管理客户会员，成为企业的难题。中关村科金外呼机器人通过智能化沟通技术，为企业提供了一站…...

编程日记 2025/5/13 17:47:22

css绘制圆并绘制圆的半径

<div class"item1"></div>.item1 {position: relative;width: 420px;height: 420px;border-radius: 50%; /* 圆形 */color: white; /* 文本颜色 */background-color: rgba(154, 227, 36, 0.4); } .item1::before {content: "";position: absol…...

编程日记 2025/5/12 4:36:28

实现类似gpt 打字效果

1. css的动画（animation) css中实现动画有两种方式：transition过渡动画、 animation自定义动画。具体的可以看MDN链接：https://developer.mozilla.org/zh-CN/docs/Web/CSS/animation 使用keyframes自定义关键帧动画并未其命名使用自定义动…...

编程日记 2025/5/14 13:49:38

【乐企文件生成工程】根据特定要素动态选择需要生成的发票板式文件实现

乐企版式文件生成工程，涉及到多个票种，不乏特殊票种的生成，如果每个特殊票种都单独写逻辑，那整个代码写起来体量就不得了，如何实现代码逻辑的同时也更优雅的实现代码扩展性呢，您接着往下看。使用设计模式工厂模式 1、定义接口InvoiceFileService public interface Inv…...

编程日记 2025/5/11 21:10:02

near-synonym反义词生成(2)：Prompt +Bert-MLM(FT)

near-synonym之反义词生成方法二 near-synonym, 中文反义词/近义词/同义词(antonym/synonym)工具包. 方法一为(neg_antonym): Word2vec -> ANN -> NLI -> Length 方法二为(mlm_antonym): Prompt Bert-MLM(FT) Beam-Search 项目地址 github: https://github.com/yon…...

编程日记 2025/5/14 5:53:38

dockfile 配置 /etc/apt/source.list.d/debian.list 清华镜像

docker:3.12.7 镜像使用的是 debian 系统，比 ubuntu 更轻量。debian 系统内，apt 镜像源列表位于 /etc/apt/source.list.d/debian.list（作为对比，ubuntu 的镜像列表位于 /etc/apt/source.list，二者语法相同）…...

编程日记 2025/5/13 23:10:26

DAY38|动态规划Part06|LeetCode:322. 零钱兑换、279.完全平方数、139.单词拆分

目录 LeetCode:322. 零钱兑换基本思路 C代码 LeetCode:279.完全平方数 C代码 LeetCode:139.单词拆分基本思路 C代码 LeetCode:322. 零钱兑换力扣题目链接文字讲解：LeetCode:322. 零钱兑换视频讲解：动态规划之完全背包，装满背包最…...

编程日记 2025/5/10 1:37:55

Spring事务回滚

Transactional注解 Transactional作用：就是在当前这个方法执行开始之前来开启事务，方法执行完毕之后提交事务。如果在这个方法执行的过程当中出现了异常，就会进行事务的回滚操作。 Transactional注解：我们一般会在业务层当中来控制…...

编程日记 2025/5/7 15:08:36

【目标跟踪】checkpoint文件到底是什么?

说实话，我一直决定计算机视觉是个很玄的东西，里面的很多东西都是看了概念之后云里雾里，今天就把我复现代码时遇到的不懂得讲一讲——checkpoint文件是个啥？ checkpoint文件顾名思义就是一个模型检查点文件，用于保存训练…...

编程日记 2025/5/10 8:03:54

hiprint结合vue2项目实现静默打印详细使用步骤

代码地址是：vue-plugin-hiprint: hiprint for Vue2/Vue3 ⚡打印、打印设计、可视化设计器、报表设计、元素编辑、可视化打印编辑本地安装包地址：electron-hiprint 发行版 - Gitee.com 1、先安装hipint安装包在本地 2、项目运行npm（socket.…...

编程日记 2025/5/13 2:01:58

apt和apt-get软件包管理工具-debian

apt 和 apt-get 是在基于Debian的Linux发行版（如Ubuntu）中使用的两个软件包管理工具，它们都属于APT（Advanced Package Tool）的前端工具，用于管理软件包的安装、更新、升级和删除。以下是它们的特性和一些比…...

编程日记 2025/5/13 10:14:44

小程序租赁系统开发的优势与实践探索

内容概要小程序租赁系统开发正在引起广泛关注，特别是在数字化快速发展的今天。很多企业开始意识到，小程序不仅能为他们带来更多的客户，还能极大地提高管理效率。借助小程序，用户在租赁时可以更加方便地浏览和选择产品&#xff0…...

编程日记 2025/4/11 0:52:16

sheng的学习笔记-AI-模型评估-留出法、交叉验证法、自助法

Ai目录：sheng的学习笔记-AI目录-CSDN博客评估方法： 数据集可以分为训练集，交叉验证集，测试集。训练集相当于自己做作业，验证集相当于考试测试一下自己的实力，测试集就是真刀真枪的干（当你…...

编程日记 2025/5/14 0:07:58

【Unity3D】ECS入门学习（六）状态组件 ISystemStateComponentData

当需要获知组件是否被销毁时，ECS是没有回调告知的，因此可以将组件继承于ISystemStateComponentData接口，这样即使组件的实体被销毁了，该组件本身是不会消失的，所以可以通过在组件实体销毁后，去设置状态组件…...

编程日记 2025/5/10 4:03:39

DVWA靶场第三关 CSRF

CSRF的中文叫：”跨站请求攻击“，它是通过仿照某一个特殊的网页（重置密码）来进行诱惑性攻击。难度（low级） 审计代码： <?phpif( isset( $_GET[ Change ] ) ) {// Get input$pass_new $_GE…...

编程日记 2025/5/12 18:29:54

工作流审批功能的一些概念

1. 引言在当今数字化时代，企业与组织的运营效率在很大程度上依赖于高效、精准的工作流审批系统。随着业务日益复杂且多样化，审批流程变得愈加细致和灵活。一个完善的工作流审批系统不仅能确保任务在组织内部有序流转、协调各方资源，还能实现…...

编程日记 2025/5/10 16:02:00

深度学习与图像处理（国产深度学习框架——飞桨官方指定教材）

计算机视觉从小白到大师之路《深度学习与图像处理（PaddlePaddle版）》这一本就够了 1.引言随着人工智能技术的飞速发展，各行各业对深度学习、图像处理相关领域的人才需求日益迫切。本书旨在通过系统的理论讲解与丰富的实战案例&#xff0…...

编程日记 2025/5/11 21:11:25

音视频入门知识（二）、图像篇

⭐二、图像篇视频基本要素：宽、高、帧率、编码方式、码率、分辨率其中码率的计算：码率(kbps)＝文件大小(KB)＊8／时间(秒)，即码率和视频文件大小成正比 YUV和RGB可相互转换 ★YUV（原始数据&am…...

编程日记 2025/5/9 23:31:03

计算机网络——期末复习（3）4-6章考试重点

第四章根据IPv4第1个十进制数值判断，127以下为A类，128~191为B类，192~223为C类不能分配给主机或路由器接口的：A类网络号0和127，主机号全为0或全为1私有地址（Private IP Address）是指一类专门保…...

编程日记 2025/5/12 5:08:59

openfeign自动将Boolean默认为false

最近发现项目服务间，通过openfeign调用API时，为null的Boolean类型，接收端反系列化后变为false了，经查发现是通用组件中做了处理，特记录下。主要是设置了这个 SerializerFeature.WriteNullBooleanAsFalse Bean Cond…...

编程日记 2025/5/9 23:30:08

如何实现底部导航栏

文章目录 1 概念介绍2 使用方法3 示例代码我们在上一章回中介绍了TextField Widget,本章回中将介绍BottomNavigationBar Widget。闲话休提，让我们一起Talk Flutter吧。 1 概念介绍我们在本章回中将介绍一个新的Widget:BottomNavigationBar，它就是我们经常在App中看到了底部…...

编程日记 2025/5/12 10:26:16

【深度学习基础|pip安装】pip 安装深度学习库常见错误及解决方案，附案例。

【深度学习基础|pip安装】pip 安装深度学习库常见错误及解决方案，附案例。【深度学习基础|pip安装】pip 安装深度学习库常见错误及解决方案，附案例。文章目录【深度学习基础|pip安装】pip 安装深度学习库常见错误及解决方案，附案例。1. 错…...

编程日记 2025/5/12 18:00:25

org.apache.zookeeper.server.quorum.QuorumPeerMain

QuorumPeerMain源代码 package org.apache.zookeeper.server.quorum;import java.io.IOException; import javax.management.JMException; import javax.security.sasl.SaslException; import org.apache.yetus.audience.InterfaceAudience; import org.apache.zookeeper.audi…...

编程日记 2025/5/13 18:29:06

使用场景介绍

安装与配置

代码演示增删改查

如何在nodeRed中运行想要的结果

如何个性化配置nodeRed

相关文章：