Main UI - Not displaying images or videos - OH3

Are you acces openHAB via http or https? Might be https in a https session?

Have you tried the link with /static/?
Works for me.

http://yourIP:8080/static/Picture.png

Both the camera and the thing use http (non-secure) and with the android app I can connect locally over http and remotely over https. Unfortunately this makes no difference.

Another weird test. I tried setting up a small shell script that uses wget to get the static camera image and put that in my nginx public html folder. If I then use an image like this in Main UI it works:

component: oh-image-card
config:
url: https://my-public-dns-name/oh/snap/snap.jpeg

That refers to an openhab web directory or specific camera? Or does the ui do something with the parsing when you have static.

Are you pointing that url towards a camera directly or towards the IP Cam widget?

I am not sure about this.
My pictures are located under \\IP\openHAB-conf\html\images\Image.png
and my path in cards and floorplans is: http://IP:8080/static/images/Image.png

So the /static/ refers to the html folder I think.

Yep yep, that’s for the openhab web directory i referenced so not applicable unfortunately. Appreciate you trying to help either way :slight_smile:

Maybe. Sitemap+BasicUI use an image proxy servlet built in to openHAB.
Looking at the URL of an image at the browser, it’s something like
http://youropenhab:8080/proxy?sitemap=default.sitemap&widgetId=01020000&t=1633686921137
The proxy (part of the Jetty sub-system) fetches the image from the real device/service according to the sitemap content. The browser gets it from the proxy.

No idea what happens in the non-sitemap UIs Perhaps they can’t use the proxy.

Thanks! Sounds like you might be on to something (here’s to hoping). Is there someone we or I can ping into this thread to shed some more light on the situation?

Well, you could start by finding out what image your browser is trying to display, using its ‘inspect’ development tools or whatever on the broken icon.

Pinging people is generally discouraged; you’ve put all the right details and tags in your post header for interested people to find it :smiley:

Haha, gotcha :smiley: I’ll do some browser inspection (know what it is but not really in my daliy arsenal) and see if I can make heads or tails of this. I’m just seeing a lot of people using the same setup and for them it seems to be working so I’m also curious as to why it’s borked for me.

Hmmm, actually with you triggering the right things in my brain I figured it might have something to do with my network/nginx setup and sure enough. I tried connecting straight into openhab using port 8084 and then it worked in both Main UI and Basic UI, both when using the browser and when using android app on cell phone. So, I have to look at my network and proxy setup I guess.

Pointing browser/app towards http://192.168.13.12:8084 - works for both Basic and Main UI
Pointing browser/app towards https://192.168.13.12:8444 - works only for Basic, not for Main UI
Pointing browser/app towards https://public-url - works only for Basic, not for Main UI

I’m guessing the oh-proxy sort of fixes the setup for Basic behind the scenes.

If you upgrade to the latest milestone the ipcamera binding has changed to use port 8080 if that helps to use relative URLs.

When you say it does not work, do you mean when your on the same network or are you trying only remotely?

So, I think I figured some of it out. When configuring I usually go to my external adress even sitting at home due to bookmarks etc. When connecting to the server locally using 8084 (switched from 8080 manually) everything works. When connecting to the server using 8444 (my configured ssl port) images don’t work in Main UI/HabPanel, due to the oh-proxy mentioned earlier I’m guessing.

So, my solution I’m working on at the moment is this.

Locally - use the non-encrypted port 8084 when connecting.
Remotely - I’m setting up nginx to expose my mjpegs externally using ssl and username/password, then I should be able to target these in the UI. Stay tuned :wink:

The only thing that confuses me still if the oh-proxy explains why sitemaps/Basic UI works so well is why the secure server connection (8444 in my case) doesn’t work locally. Inspected the pages over 8084 and 8444, they both point to the same local non-secure stream link.

This is the problem I mentioned as you are trying to display using HTTP inside an HTTPS page.

Relative URL would resolve this.

1 Like

Yeah, my brain actually wondered if that might be the case - it was me being thick, sry :slight_smile:

I might have a look into this as well later on. Right now I got my mjpeg proxied so that everything works externally without VPN so I think I might be able to get this running exactly how I want.

This is what the built-in OH proxy is supposed to avoid. (and does, for sitemaps).
Is there some trick to configuring MainUI for similar, what widget are you using and how is it configured?

Completely understand and would love for all the UI’s to use this so I could just expose oh3 over ssl with auth but then that’s unfortunately not an option today as long as I’m not happy with running only Basic UI externally (which I actually might be).

I think folk have been avoiding this by using IPcamera binding to ‘proxy’ snapshots.

I’ve been having the same problem with both direct access and that widget. Right now I’m using that widget to create a mjpeg stream as my current camera does not provide this natively. As the Camera widget spawns a “local server” that you connect to you would run into this with external access anyways. Maybe I’ve misunderstood the entire widget? :stuck_out_tongue:

Realized I confused binding with widget in my reply. Still, that widget is more to support credentials and such when creating layouts. Meaning it might be a prereq to get a proxied stream with un/pw to show but it doesn’t solve the problem of the stream needing to be proxied?