# Custom ui node: how to get synchronisation between sessions and after page refresh

**URL:** <https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065>\
**Category:** Dashboard\
**Created:** [2 May 2021 15:57 UTC](https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065 "2021-05-02T15:57:50Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Christian-Me](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/christian-me/32/10774_2.png) [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)\
**Post date:** [2 May 2021 15:57 UTC](https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065/1 "2021-05-02T15:57:51Z")

</div>

Hi

I'm currently trying to code my first ui-widget. All works so far and it is nearly done thanks to the example I found in ui-nodes.

Now I got one problem: The current state of the widget is not forwarded to different clients / sessions when the values are changed in the dashboard by user input. New messages are sent to all clients and messages from all clients arrive @ the backend.

And after page refresh the current state is lost. The "my little ui node" shows the same behaviour so no help there.

Any quick explanation or example to get an idea how the mechanic is working?

As always thank you for your help.

Chris

---

<div class="post-metadata">

**Author:** ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)\
**Post date:** [2 May 2021 16:31 UTC](https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065/2 "2021-05-02T16:31:26Z")

</div>

I think this is an interesting question/case so it will be great when there is an explanation given. I needed the same earlier but I coded the ui in javascript & html using a standard template node. To send the same information to all connected clients I use websocket. To initiate a client with correct statuses after a page refresh the client sends a websocket command (using the "onLoad" in the body tag) to tell NR to push current statuses "to all" connected clients. In this way I could keep all clients in sync

---

<div class="post-metadata">

**Author:** ![Christian-Me](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/christian-me/32/10774_2.png) [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)\
**Post date:** [10 May 2021 20:54 UTC](https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065/3 "2021-05-10T20:54:25Z")

</div>

Finally I found out how to do this with custom ui nodes. If you set the `storeFrontEndInputAsState` to `true`the dashboard does the work for you. It will pass the last state and every new state to all connected clients as normal messages. A little bit tricky (at lest for me) is how to determine if the origin of a message is actual the own message sent by the client to avoid undesired loops. But in the end I found a solution (I think)

> [@\[ANNOUNCE\] colour picker widget based on iro.js](https://discourse.nodered.org/t/announce-colour-picker-widget-based-on-iro-js/45393):
>
> node-red-contrib-ui-iro-color-picker Alternative color picker node utilizing the [iro.js](https://iro.js.org) widget. The main credit goes to [James](https://jamesdaniel.dev/) for the iro.js widget. I was searching for a colour picker which is usable in different ways and on mobile devices for a long time. iro.js popped up in the forum from time to time and to be honest I hoped that someone else (with more experience) could do the job. In the end I was procrastinating other jobs and thought it would be a nice small project to learn how to i…

---

<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:** [9 June 2021 20:54 UTC](https://discourse.nodered.org/t/custom-ui-node-how-to-get-synchronisation-between-sessions-and-after-page-refresh/45065/4 "2021-06-09T20:54:35Z")

</div>

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