英文:
Nodered: can't send data from frontend to backend using eventlistener
问题
I have created a custom node for the Node-RED editor and am trying to listen to an emitter from the frontend.
However, the listener only seems to work for events from the backend.
Switch it around and it seems to work. The frontend listener receives the data I am trying to send.
Is it perhaps not possible to listen for events coming from the frontend?
The backend looks like this:
module.exports = function(RED) {
function TestingNode(config) {
RED.nodes.createNode(this, config);
let node = this;
// Listener works fine, if the emitter is also in the backend
RED.events.on("runtime-event", function(event) {
if (event.id === 'mySuperCreativeId') {
// Emit the event to the node's output
node.send({ payload: event.payload });
node.warn("works fine");
}
});
// Emitter works for backend and frontend
node.on('input', function(msg) {
RED.events.emit("runtime-event", {
id: 'mySuperCreativeId',
retain: false,
payload: "some payload"
});
});
}
RED.nodes.registerType("testingNode", TestingNode);
};
The frontend looks like this:
<script type="text/javascript">
// This listener works fine
RED.comms.subscribe("notification/#", function (topic, payload) {
if (topic.startsWith("notification/mySuperCreativeId")) {
alert(payload);
}
});
RED.nodes.registerType('testingNode',{
category: 'function',
color: '#e2d96e',
defaults: {
name: {value:""}
},
inputs:1,
outputs:1,
icon: "white-globe.png",
label: function() {
return this.name || "testingNode";
}
});
function start() {
// Nothing seems to happen here
RED.events.emit("runtime-event", {
id: 'mySuperCreativeId',
retain: false,
payload: "some payload"
});
}
RED.sidebar.addTab({
id: "123456789",
label: "Testing",
name: "Testing",
iconClass: "fa fa-tasks",
content:'<button onclick="start()">start</button></div>'
});
</script>
(Note: I have removed the HTML encoding for better readability.)
英文:
I have created a custom node for the nodered editor and am trying to listen to an emitter from the frontend.
However, the listener only seems to work for events from the backend.
Switch it around and it seems to work. The frontend listener receives the data I am trying to send.
Is it perhaps not possible to listen for events coming from the frontend?
The backend looks like this:
module.exports = function(RED) {
function TestingNode(config) {
RED.nodes.createNode(this, config);
let node = this;
//Listener works fine, if the emitter is also in the backend
RED.events.on("runtime-event", function(event) {
if (event.id === 'mySuperCreativeId') {
// Emit the event to the node's output
node.send({ payload: event.payload });
node.warn("works fine");
}
});
//Emitter works for backend and frontend
node.on('input', function(msg) {
RED.events.emit("runtime-event", {
id: 'mySuperCreativeId',
retain: false,
payload: "some payload"
});
});
}
RED.nodes.registerType("testingNode", TestingNode);
};
The frontend like this:
<script type="text/javascript">
//this listener works fine
RED.comms.subscribe("notification/#", function (topic, payload) {
if (topic.startsWith("notification/mySuperCreativeId")) {
alert(payload);
}
});
RED.nodes.registerType('testingNode',{
category: 'function',
color: '#e2d96e',
defaults: {
name: {value:""}
},
inputs:1,
outputs:1,
icon: "white-globe.png",
label: function() {
return this.name||"testingNode";
}
});
function start() {
// nothing seems to happen here
RED.events.emit("runtime-event", {
id: 'mySuperCreativeId',
retain: false,
payload: "some payload"
});
}
RED.sidebar.addTab({
id: "123456789",
label: "Testing",
name: "Testing",
iconClass: "fa fa-tasks",
content:'<button onclick="start()">start</button></div>'
});
</script>
答案1
得分: 0
这不是这种方式工作的，前端和后端代码完全分离。
如果您想从编辑器发送事件到后端，您需要在后端代码中实现一个HTTP端点，并在前端进行HTTP调用。
核心节点中有多个此模式的示例，例如注入节点：
英文:
It doesn't work this way, the frontend/backend code are totally separate.
If you want to send events from the editor to the backend, you need to implement a HTTP endpoint in the backend code, and make a HTTP call in the frontend.
There a multiple examples of this pattern in the core nodes e.g. the inject node
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论