Help with simulation using Backend and UI

I have successfully run the Getting Started simulation in it’s entirety with all components running on Ubuntu 22LTS. To simulate my intended configuration I want to run Edge on a Raspberry Pi.

Edge is running on the RPi and connected to the back as with Controller Api Backend like this.
image

I can see that Edge has connected to the Backend in the debug messages.

When I do this the webpage UI (localhost:4200) comes up blank, no gauges, etc.
Why doesn’t it work?
What else do I have to do to have Edge running on a different computer and connect to the Backend?

A somewhat related question. Why doesn’t the webpage UI localhost:4200 work from another computer (ie 192.168.2.122:4200) This is how I use all the Apache pages and they work fine (eg http://192.168.2.107:8080/system/console/configMgr)

Thanks.

1 Like

Will someone please help with this. Connecting Edge to Backend on another computer is how this system is intended to work. I assume this is done by the setting shown above. Am I wrong? How do you set the backend IP is that isn’t it. This is very frustrating as it seems obvious but doesn’t work and is holding up most of my other work with evaluating OEMS.

Also, a simple question. Why doesn’t the webpage X.X.X.X:4200 work for the UI? The point is to run the web browser on another machine so it would seem obvious this should work?

Help would be appreciated.

To see the UI on another machine here is my solution:

In file angular.json in blahblah \ GitHub\openems\ui from Line 138 I add host & port options:

"serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "host": "xx.xx.xx.xx",
        "port": "8083",
        "browserTarget": "app:build:openems,openems-edge-dev"
      },

The host is my PC’s ip address
The port is just one I picked.

If this is horrible/dangerous please let me know. I am a monkey who is good with spanners and so I offer no guarantees :slight_smile:

I did not need this before, because once we need to access the UI from remote, we already put an NGINX proxy in front (see this German post for a working NGINX config: UI am Raspberry konfigurieren - #2 by stefan.feilmeier)

According to…

…it might actually be sufficient to run UI via:

ng serve -c openems-edge-dev --host 0.0.0.0

Official docs is not very clear on that, unfortunately: Angular

Regards,
Stefan

2 Likes

Yes you are right, --host 0.0.0.0 works with no change to the code required. But you made me think it did not work by using -edge. It took me some time to understand why the UI was not working :thinking: :laughing:

For clarity the following code will allow UI access from remote via backend:

ng serve -c openems-backend-dev --host 0.0.0.0

This will allow UI access from remote without backend:

ng serve -c openems-edge-dev --host 0.0.0.0

Thank you, the links are also helpful.

2 Likes

The postings by @NiallDarwin helped me to find my problem. I am embarrassed to admit that somewhere in my process I got my ‘ng blah blah’ command line confused and I was starting openems-edge-dev instead of openems-backend-dev. Duh!
I have it working now. Edge on RPi, Backend on Ubuntu.
Thanks!

3 Likes

I’m embarrassed & irritated that I couldn’t get UI to work. Embarrassed because I was still typing EDGE in this line when I should be typing BACKEND:

ng serve -c openems-edge-dev

Irritated because I was following the documentation and so shouldn’t have been wrong. So I have corrected the documentation and hope my change is approved :smiley:

From my understanding, the documentation is accurate because it details the procedure for setting up the Edge UI and Edge Java locally. Thus, it’s essentially correct.

However, there should indeed be an extension to the documentation covering how to develop backend components, but as you’re already aware, this is quite time-consuming.

Best regards!

2 Likes

Yes, you are correct. I was looking in the wrong part of the documentation.This is where I should have been for setting up UI with backend:
https://openems.github.io/openems.io/openems/latest/gettingstarted.html#_connect_openems_ui_with_backend

1 Like