Iframe stopped refreshing

Third party integrations HADashboard
#1

Hi, I have the following widget:

meteogram:
  widget_type: iframe
  refresh: 1800
  img_list:
    - (URL to .png image)

I show the dashboard in WallPanel. It used to refresh as expected (you can deduce the approximate time from the image), but now it does not refresh any more.

I have tried restarting WallPanel and HADashboard, and also lowering the refresh value to 1 second and try in Chrome. I am not entirely sure it did not reload in Chrome, but I would expect the image to be “blank” for a short duration when refreshing. I also tried to see if anything happened in the Network console in Chrome with no luck.

#2

setting the refreh to 1 would drive the dash crazy if it could work.
use at least an amount of seconds that gives the dash time to load and show (i would say 10 or more)

it could be a caching problem from chrome. and that may be changed with some chrome setting.

#3

It was just to provoke some results - I am not keeping that setting :slight_smile: I guess the image provider would be the most annoyed.

I would expect it to behave differently in the original app (WallPanel) if Chrome was the issue - and it worked fine a week ago.

#4

and what have you done in that week?

#5

Added two other dashboards, removed and re-add a z-wave sensor in HA that misbehaved, added some AppDaemon apps (currently not in use). Before that, I also added an extra temperature to the dashboard.

#6

doesnt seem anything that would effect that behaviour.

#7

Nope, I agree. I have tried on another tablet as well now, with the same results.

#8

maybe @aimc has a clue what to look for?

#9

I just realized I might have upgraded from HA 0.49 to 0.49.1 about when it stopped refreshing (all configuration is in Git, but not HA version, so that’s why I forgot :slight_smile: ). I am not exactly sure about the timeline, but it might be a pointer.

#10

Upgrading to 0.50.x did not help. I may try downgrading, even though I guess the problem lies somewhere else.

I am not very experienced in web development, but I took a look at the source code, and it seems like there are timers refreshing the clock every 500 ms, using an interval function, while the iframe refresh seems to set a one-shot timer and then trigger a new timer inside the handler function. Maybe it does not get to run? I tried disabling the clock with no luck.

Update: I added another image, and it switches between them properly. Maybe the issue is that the image is not actually refreshed. The code seemed to just set the source URL of the image, not force a refresh. @aimc, is the “refresh” property intended to trigger a refresh, or just specify how long each image in the list is displayed?

#11

Not sure here - it works fine for me, I have my weather maps on it. Are you getting any JavaScript errors?

#12

I am also using it for weather (check out https://www.yr.no/place/United_States/New_York/New_York/meteogram.png, I think it is very nice). So, I suppose it is intended to refresh, not only cycle through images downloaded once. From what I could guess from the source, though, it seems like the function only updates the image source URL, is that correct?

Do you know about any test images with a time stamp? The Yr image is a bit hard to use for debugging, since it updates every hour or so…

#13

Sorry, forgot to add that I don’t see any errors in the console. I am multitasking between making pancakes and the forum :smile:

#14

That is correct - and that forces the browser to refresh. What browser are you using by the way? I develop for Chrome.

#15

I plan to use, and discovered the problems, in HADashboard on Android. I have also tested this on a Chrome “desktop app” on Android, and Chrome on Mac.

Could it be that in certain Chrome versions or situations that it uses the cached image instead? Is there a function I could try that forces an image refresh? During the little javascript development I have done myself, I discovered that caching was mysterious and unpredictable… :slight_smile:

#16

It seems you are using a library called Knockout, and use a ViewModel function to perform the update. From this thread at Stack Overflow, I gather someone else has the same problem - maybe it’s worth a try!

edit: I managed to download a copy of appdaemon and modify the widget to add a timestamp to the image, in order to invalidate the URL. Will update with the result tomorrow. If it works, is the proper procedure to make a fork of appdaemon on github and create a pull request? Or is it possible to just send in a patch?

#17

It did not work, yr.no is not accepting dummy parameters… https://www.yr.no/place/United_States/New_York/New_York/meteogram.png?12345 is rejected by the server, https://www.yr.no/place/United_States/New_York/New_York/meteogram.png#12345 seems to not force a cache invalidation.

1 Like
#18

Pity - I’ll take a look at the thread you posted. If you do find a fix I prefer Pull Requests :slight_smile:

#19

Thanks! I implemented the suggested solution (appending ? to the image URL), but when whether it works it is server dependent, it is better to not mess with the URL. I have not found other ways to force a refresh yet.

#20

I have now tried to use a local fetcher instead, adding meta tags to the HTML, adding a cache invalidation parameter to the URL, and using an image proxy - with no luck. I also tried a classical counter, which is not updated. Maybe it is something else on my end.

Could you try this?

counter:                                                                                                                                                                                                     
  widget_type: iframe                                                                                                                                                                                        
  refresh: 5                                                                                                                                                                                                 
  img_list:                                                                                                                                                                                                  
    - http://www.reliablecounter.com/count.php?page=iframerefreshtest&digit=style/plain/1/&reloads=0