Clever Geek Handbook

Preventing iframe caching in Chrome

I have an emulator that I wrote to test smart TV web apps. The emulator itself is a web application with a simple interface showing TV and remote access and loads the web application being tested inside the iframe. Users start the emulator from the command line, which starts two simple HTTP servers (one for the emulator, one for the web application under test), then starts chrome using the -app command line switch pointing it to my emulator.

The problem is that every time Chrome starts up, it downloads the cached version of the web app. If you've made changes to your web app since you last run, they don't show up until you do a hard page refresh.

To get around this, I tried the following:

  • Launch Chrome with -disable-cache key added
  • Adding the random parameter request to the URL-address run transmitted in chrome (eg --app=http://localhost:6001/?random={some_hash}

    )
  • Adding an arbitrary query parameter to the url of the web app specified in the iframe
However, none of this seems like a gimmick. The emulator code doesn't seem to be cached as the src url in the iframe does get a new random value appended to it every time. However, the page loaded in the iframe is old and always needs to be updated after initial launch.

Any other things I can try that I haven't covered above?

The following example of a problem:

  • User launches emulator for the first time for web application 1
    • Web App 1 shown in the emulator
  • User closes the emulator
  • User launches emulator for web app 2
    • Web App 1 shown in the emulator

In this case, the emulator starts and still shows web app 1. It keeps showing web app 1 until the update, until the user does a hard refresh (cmd + shift + r), after which web app 2 finally renders.

+3


source to share


1 answer


It looks like it might be related to a bug here: https://code.google.com/p/chromium/issues/detail?id=324102

As a workaround, I found that setting the iframe src from javascript ALONG WITH adding a random query parameter to the url seems to do the trick. Just doing this or that doesn't work.



Example:

// still loads stale page
document.getElementById('tv-screen').src = 'http://localhost:6001/'; 

// will load fresh page
document.getElementById('tv-screen').src = 'http://localhost:6001/?rand=' + Math.round(Math.random() * 10000000);
+7


source






More articles:


All Articles