HTML5 browsers hanging on to cached manifest file

Question

I'm using HTML5 appcache and mostly it's working well. However, sometimes, users' browsers (Chrome or Safari) will hold onto the cached manifest file even though I'm positive that the server has a brand new manifest file with a unique version number inside of a comment (like with "# app version 1.0.0.8" or whatever).

In IIS (version 6), the content expiration was set to 1 day, so could that be the problem? I can't seem to reproduce this issue which makes debugging difficult. As a precaution, in IIS I've changed the content expiration to "expire immediately" for the directory that stores the manifest file. Could that explain why some browsers were hanging onto manifest files even when a new version was available?

I also noticed that when a browser was behaving this way, even if I deleted the manifest file on the server, the user's browser would use its own cached copy of the manifest file which isn't supposed to happen if the file is no longer available in my understanding.

Thanks,

Andy

Answer 1

Taken from my answer here : https://stackoverflow.com/a/13282735/727575

Yes, this is the current "correct" behaviour. It has nothing to do with IIS content expiration. This is what happens:

When you just made changes to the manifest file, and you refresh the browser, this is what happens (assuming you're online)

• the browser first loads back all the files in the cache
• then the browser check online for your manifest file
• it detects that the manifest file has changed, it will then proceed to download the new files
• however, keep in mind, at this time, you will still be looking at your 'old files' because the browser has loaded the old files before going online to download the 'new files'
• if at this point, if you hit refresh again (2nd time), you should get the 'new files'
• This is currently the standard behaviour. Some people put some event handlers to prompt the user to do another refresh (after the 1st refresh)

So basically, you need to refresh twice or throw one of the event from 'window.applicationCache' to handle it

To look at an example of using window.applicationCache, go here : http://www.html5rocks.com/en/tutorials/appcache/beginner/

it's under the "Updating the Cache" section.