Uibuilder Pfad-Problem

[B748]

Beim Versuch die uibuilder-Contribution über Node Red einzubinden konnten nach dem Node-Deployment JQuery (Pfad "./vendor/jquery/dist/jquery.min.js") und SocketIO (Pfad: "/uibuilder/socket.io/socket.io.js") nicht geladen werden.

Wie müssten die Pfade geändert werden? Ist es möglich, dass wegen der geänderten Struktur durch redmatic das base-Directory „uibuilder“ nicht existiert?

Bei einer „normalen“ Node-red Einbindung klappt alles wie vorgesehen.

[hobbyquaker]

ich vermute das liegt daran: TotallyInformation/node-red-contrib-uibuilder#30

[B748]

Ich habe das Problem dort versucht nachzuvollziehen und bin mir nicht sicher, ob das tatsächlich der Grund ist. Auch jquery findet sich schließlich nicht; zeitweise das gleiche mit normalize.css. Auf der CCU finden sich im Dateisystem zumindest wie erwartet die passenden node_modules. Ich habe diverse Pathes ohne erfolg durchprobiert.

Soweit ich das überblicke sollte nicht nur unter http://<ccu-ip>/addons/red/<node_url>/ sondern auch unter http://<ccu-ip>/addons/red/uibuilder/ eine Antwort kommen. Ersteres lädt die statischen Daten, findet aber die scripte nicht und letzteres quittiert der Webserver mit "Cannot GET /addons/red/uibuilder/". Ich habe den Verdacht, dass irgendwie die node-scripte nicht (richtig?) geladen werden (uibuilder.js o.ä.).

Bin dankbar für jeden Tip... (notfalls auch wie ich anders ein komplett frei gestaltbares Dashboard umsetzen kann)

Vielen Dank & Grüße,

Stephan

[TotallyInformation]

Hi, sorry I have no German.

I have updated and closed the referenced uibuilder issue.

On reflection, I've rejected the issue as the reference to the socket.io library must always be static, it cannot move with httpNodeRoot. If it were allowed to move, it would not be possible to have a single reference index.html file since the location of socket.io would always be unknown.

However, there was a 2nd bug that is fixed in uibuilder v1.0.11 - that was setting the incorrect namespace if httpNodeRoot was being used which prevented communications from happening correctly.

[hobbyquaker]

@TotallyInformation thanks for your feedback! Does that mean that it's still not possible to use httpNodeRoot? This would be a pity, I think many Node-RED Users have to use httpNodeRoot for different reasons - so these users can't use your uibuilder? Why not just use a relative path for socket.io like e.g. node-red-dashboard is doing? Or maybe use a javascript workaround that reads out window.location, constructs the correct absolute path and injects the <script src="... then?

[TotallyInformation]

No, you can absolutely use it. Just get the latest version. All instances of uibuilder will use the same instance of socket.io. The main thing is that the client and server versions match. This works fine.

I am now using httpNodeRoot on my dev system to make sure that it works fine.

uibuilder can't do what Dashboard does because it works in a very different way and is much more flexible. The disadvantage is that it uses physical template files which need to be able to connect back to the socket.io. But there isn't a need to have more than one path to the socket.io client as long as there is only 1 version of the socket.io server. Having more than 1 would be a waste of resources.

All of the workarounds you mention might also be possible but not needed.

Hope that clarifies things? If you have any other issues or queries, please do get back to me.

[hobbyquaker]

Thanks for the clarification!

[hobbyquaker]

@B748 kannst Du dann nochmal testen ob uibuilder nun mit RedMatic funktioniert?

[B748]

Mach ich!

Habe zwischenzeitlich allerdings eine eigene webApp-UI in Angular 7 erstellt (inkl. Editor). Sobald die gröbsten Schnitzer beseitigt sind mach ich sie zugänglich. Vielleicht lassen sich da zukünftig Synergien heben ;-)

[hobbyquaker]

Ui, das klingt spannend, freue mich drauf wenn Du es veröffentlichst, bitte gib Bescheid. Ich hab derweil übrigens ebenfalls mit sowas angefangen, auch mit wysiwyg drag&drop editor, allerdings auf Polymer 3 basierend.

[B748]

Hat sich leider nichts verändert. Meinem Verständnis nach ist das Problem nicht die Verbindung von Uibuilder-backend (socket.io) zu Node-Red, sondern die Verbindung des Frontends zur socket.io-Implementation. Das static serving der index.html funktioniert ja, nur führen einzelne Pfade der eingebundenen Skripte zu 404s:
Uibuilder versucht z.B. immer noch mit socket.io auf dem root href zu kommunizieren anstatt auf addons/red und dann z.B. /uibuilder. Ich habe testweise das static serving abgeändert - das hat aber so erst einmal nicht funktioniert. Ich fürchte da müsste man doch etwas tiefer in den Quellcode einsteigen und unter Umständen sogar das Konzept etwas abändern. Eine einzelne socket.io-Instanz im backend ist jedenfalls machbar. So (ähnlich) habe ich auch mein Projekt aufgestellt (du glaube ich auch, wenn ich deinen web-app code noch richtig im Kopf habe).

Ich hoffe, dass ich es in den nächsten Wochen schaffe meinen Code in einen ersten, belastbaren Zustand zu bekommen. Stelle ihn dann online...

[psi-4ward]

Als quickfix kann man in https://github.com/TotallyInformation/node-red-contrib-uibuilder/blob/master/nodes/uibuilder.js#L174

const uib_socketPath = tilib.urlJoin('/addons/red', moduleName, 'socket.io')

verwenden. Damit ist der Websocket-Client unter /addons/red/uibuilder/socket.io/socket.io.js zu erreichen.

Alternativ wartet man auf v2, hier scheint das Problem angegangen worden zu sein.

[psi-4ward]

@B748 komm doch mal im Slack vorbei oder kontaktiere mich direkt :)
Dankschee

[ptweety]

@B748 : Gerda eben mit v2.0.5 von uibuilder mal kurz getestet und es sieht jetzt tatsächlich gut aus. Ggfs. kann ja dann auch dieser issue geschlossen werden?

[Hypnos3]

Issue kann geschlossen werden. Mit UI Builder > 2.0 läuft es.