# Send data from Runtime to Editor

**URL:** <https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798>\
**Category:** Core Development\
**Created:** [7 July 2022 12:49 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798 "2022-07-07T12:49:14Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![dannyhuly](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dannyhuly/32/71604_2.png) [@dannyhuly](https://discourse.nodered.org/u/dannyhuly)\
**Post date:** [7 July 2022 12:49 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/1 "2022-07-07T12:49:14Z")

</div>

Hi,

I would like to push messages from the runtime to the editor and use notify (or other method) to display them.

I have stumbled across [CommsConnection([Global - Documentation](https://nodered.org/docs/api/modules/v/1.0/global.html#CommsConnection)) which takes about WebSocket between the runtime to the editor.  
Sadly I wasn't able to figure out how to integrate with this module on the run time end.

I'm using NodeRed 2.2.2 as an [embedding](https://nodered.org/docs/user-guide/runtime/embedding) application.

Any ideas will be greatly appreciate.  
Thanks.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [7 July 2022 15:02 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/2 "2022-07-07T15:02:35Z")

</div>

Really, there is, and should be, a deliberate gap between the runtime and the Editor. It is the intent of the project to further separate them in the future.

I've not myself seen CommsConnection mentioned anywhere else so I can't comment about it specifically. However, the recommended approach of communication between a custom node's runtime and the Editor is to set up an API in the runtime and access that from the Editor using jQuery's AJAX methods or Fetch.

Obviously though, this is a pull rather than a push.

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [8 July 2022 07:31 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/3 "2022-07-08T07:31:26Z")

</div>

Hi @dannyhuly,

You can find an example in one of my nodes.

1. On the server side (see [here](https://github.com/bartbutenaers/node-red-contrib-xterm/blob/master/xterm_config.js#L112)) I push my data into the Node-RED standard websocket:

2. On the client side (see [here](https://github.com/bartbutenaers/node-red-contrib-xterm/blob/master/xterm_config.html#L312)) I read that data, to use it in the flow editor:

Good luck with it!  
Bart

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [8 July 2022 09:22 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/4 "2022-07-08T09:22:17Z")

</div>

It might be helpful here to have a comment from @knolleary as to whether that is an acceptable use of the API as I don't think it is documented and we are generally advised not to use undocumented features of the API?

Had I known about this, it would **_greatly simplify comms_** between the uibuilder back-end and Editor front-end.

---

<div class="post-metadata">

**Author:** ![dannyhuly](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dannyhuly/32/71604_2.png) [@dannyhuly](https://discourse.nodered.org/u/dannyhuly)\
**Post date:** [10 July 2022 09:17 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/5 "2022-07-10T09:17:21Z")

</div>

I was able to achieve my desired behavior by using the plugin API (suggested in @BartButenaers example).

Thanks for the help.

### Heres is a POC:

1. When the runtime start it will publish a **tick** message every sec.
2. When the editor loads in the browser it will subscribe to the **tick** messages and will console them.

**package.json**

```json
{
    "name": "tick-to-editor",
    "node-red": {
        "nodes": {
            "tick-to-editor": "tick-to-editor.js"
        }
    }
}

```

**tick-to-editor.js**

```js
module.exports = function (RED) {
    setInterval(() => {
        RED.comms.publish("tick", `${Date.now()}`);
    }, 1000);
}

```

**tick-to-editor.html**

```html

<script type="text/javascript">
    RED.comms.subscribe('tick', function(eventName, msg) {
        console.log(msg);
    });
</script>

```

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [10 July 2022 11:06 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/6 "2022-07-10T11:06:55Z")

</div>

Why do you want to do this?

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [10 July 2022 12:15 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/7 "2022-07-10T12:15:12Z")

</div>

He Colin,  
He is just sharing his POC which he used to test to push some dummy data across the websocket channel. I don't think this simple experiment will grow to become to become an alternative for Tik-Tok 😉

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [10 July 2022 12:34 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/8 "2022-07-10T12:34:10Z")

</div>

OK, understood.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [10 July 2022 19:27 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/9 "2022-07-10T19:27:23Z")

</div>

Final warnings on this.

The API is completely unpublished so there is no guarantee that this API will remain in the future nor that it might not change.

Also, be very careful on naming your events since again, there is no guarantee what names might be in use or may be used in the future.

* * *

And a final comment - a real shame you can't use the same approach to send messages from the Editor to the runtime 🙂

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [10 July 2022 21:18 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/10 "2022-07-10T21:18:47Z")

</div>

> [@TotallyInformation](#):
>
> o, be very careful on naming your events since again, there is no guarantee what names might be in use or may be used in the future.

I will echo this point @dannyhuly - if you choose to go down this route, make sure you give your events names unique to your node. Do not use single word names.

---

<div class="post-metadata">

**Author:** ![dannyhuly](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dannyhuly/32/71604_2.png) [@dannyhuly](https://discourse.nodered.org/u/dannyhuly)\
**Post date:** [11 July 2022 06:42 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/11 "2022-07-11T06:42:24Z")

</div>

@TotallyInformation you have a good point and I'm still on the fence about using the Cooms or just user WebSocket of my own. But I do like the Cooms solution because Its uses native RedNode infrastructure which simplify the code.

@knolleary thanks for the heads up. In my real code the message name is more complex and follows the NodeRed event name convention `<COMPONENT_NAME>:<ACTION>`.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [25 July 2022 06:43 UTC](https://discourse.nodered.org/t/send-data-from-runtime-to-editor/64798/12 "2022-07-25T06:43:14Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.