Android App do not show grafana charts

Hi,
I use webview to show grafana chart on my sitemap, but charts are shown on Web classic UI, but not on android app.
Grafana URL is public, reachable with valid certificate but it does not work.

Very strange because I also use webview to show stream from my Survelliance Server, ZoneMinder, and the video streaming was shown on Android App.

Someone can help me with this?

Many Thanks

Marco

Hi,
I did more testing. Using a direct Grafana Link, it work, but i’m using this code to have dynamic charts enbedded in openhab:

It work from a browser but not from Android App.

Marco

Hi @marcolino7,

not sure if this is still relevant -but I faced the same problem here and did some investigations. I was able to show grafana charts in the current openhab android app - but only if I connect to the openhab instance over http://openhab:8080 - if I use a https:// connection it did not work - as the link to the chart was http and the app will not render mixed content (https mixed with http).

Currently this only works if the application is connected to the local network - but not via myopenhab. But I’ll do some experiments with nginx on my local server to see if I can find a soultion for this (redirecting a relative path to grafana …).

As I think grafan is a great tool for visualizing and as I would like to have interactivity in the charts pre-rendering is not my prefered options. So I felt this might be interesting for other as well …

with kind regards,
Patrik

… I did some experiments on how to get the interactive grafana charts working locally and via myopenhab.org; after some experiments with nginx I found that there is an other approach that does not require nginx and is easier for my use case :arrow_right: It is possible to redirect/rewrite requests based on path using a proxy servlet. A mechanism used by OH internally (jetty):

openhab> http:list
ID  │ Servlet                   │ Servlet-Name            │ State       │ Alias               │ Url
────┼───────────────────────────┼─────────────────────────┼─────────────┼─────────────────────┼────────────────────────
60  │ Whiteboard$1              │ cxf-servlet             │ Deployed    │                     │ [/*]
78  │ ProxyServlet              │ ServletModel-2          │ Deployed    │ /grafana            │ [/grafana/*]
152 │ AudioServlet              │ ServletModel-6          │ Deployed    │ /audio              │ [/audio/*]
171 │ ChangePasswordPageServlet │ ServletModel-11         │ Deployed    │ /changePassword     │ [/changePassword/*]
171 │ CreateAPITokenPageServlet │ ServletModel-12         │ Deployed    │ /createApiToken     │ [/createApiToken/*]
171 │ AuthorizePageServlet      │ ServletModel-9          │ Deployed    │ /auth               │ [/auth/*]
187 │ EventWebSocketServlet     │ ServletModel-17         │ Deployed    │ /ws                 │ [/ws/*]
215 │ ChartServlet              │ ServletModel-20         │ Deployed    │ /chart              │ [/chart/*]
215 │ AsyncProxyServlet         │ ServletModel-23         │ Deployed    │ /proxy              │ [/proxy/*]
216 │ IconServlet               │ ServletModel-26         │ Deployed    │ /icon               │ [/icon/*]
218 │ UIServlet                 │ ServletModel-29         │ Deployed    │ /                   │ [/]
263 │ AsyncServlet              │ ServletModel-32         │ Deployed    │ /upnpcallback       │ [/upnpcallback/*]
286 │ ResourceServlet           │ /connectspotify/img:web │ Deployed    │ /connectspotify/img │ [/connectspotify/img/*]
286 │ SpotifyAuthServlet        │ ServletModel-35         │ Deployed    │ /connectspotify     │ [/connectspotify/*]
303 │ RRD4jChartServlet         │ ServletModel-39         │ Deployed    │ /rrdchart.png       │ [/rrdchart.png/*]

It is possible to register such a redirect manually in karaf with the following command:

openhab> http:proxy-add  /grafana https://localhost:3000

Note: Grafana is runing on port 3000 on the same machine. It is configured to use https with a self signed certificate. The certificate was imported in the certificate store of the machine.

Some additional configuration in grafana is required - as jetty now acts as proxy for us:

[server]
# Protocol (http, https, h2, socket)
protocol = https

# The full public facing url you use in browser, used for redirects and emails
# If you use reverse proxy and sub path specify full url (with sub path)
root_url = http://localhost:8080/grafana
serve_from_sub_path = true

cert_file = /etc/grafana/grafana.crt
cert_key = /etc/grafana/grafana.key

You’ll need to prepend the uri generated by grafana for the chart with grafana:

With this I’m able to load the graphs in the browser locally & from remote. In the android application the graphs work/load locally - but not yet from remote - browser works fine … I’ll have a look into this if I find the time :-).

2 Likes

… after a reboot remote access via app works as well - no configuration change was required :grinning:.

— update

I’m currently migrating my setup to use docker containers and this requires a small change to make the grafana integration via ProxyServlet. To access the graphs via android app from remote the chart needs to be served using https and the grafana server certificate needs to be trusted by openhab.

Therefore it is necessary to add the grafana certificate to the docker image; for this we need to create our own docker Dockerfile to load the certificate:

FROM openhab/openhab:3.4.4-debian

RUN mkdir /certs

COPY /certs/* /certs
WORKDIR /certs
RUN cp * /usr/local/share/ca-certificates/
RUN update-ca-certificates

# Set working directory
WORKDIR ${OPENHAB_HOME}

I then use a docker compose file to create the image:

version: '3.9'
services:
...
  openhab:
    depends_on:
      - location
      - frontail
      - portainer
      - influxdb
      - grafana
      - plex
      - jellyfin
    container_name: openhab
    image: pgfeller/openhab:3.4.4-debian
    build: 
      context: ../images/openhab
    restart: unless-stopped
    network_mode: host
    volumes:
      - /etc/localtime:/etc/localtime
      - /etc/timezone:/etc/timezone
      - $_OPENHAB_ADDONS:/openhab/addons 
      - $_OPENHAB_CONF:/openhab/conf 
      - $_OPENHAB_USERDATA:/openhab/userdata
    devices:
      - /dev/ttyACM0:/dev/ttyACM0
    environment:
      - CRYPTO_POLICY=unlimited

Not sure if it would make sense to add this to the openHAB docker documentation :thinking:.

with kind regards,
Patrik