My small HTML5 app needs to be re-deployed on a server. I understood I only had to touch the .appcache file to have every browser update to the last version of the files upon next visit.
The manifest looks like this:
CACHE MANIFEST
#Version: 201209251353
index.html
apple-touch-icon.png
css/styles.css
data/dump.bin
img/background.png
img/sprites.png
js/core.js
js/jquery-1.8.1.min.js
vid/walkthrough.mov
To "touch", I added a comment (#Version:) which I mean to be updated any time the content changes.
Strangely, some files are updated. Not all, for isntance, a colleague gets the latest core.js, but still displays an old walkthrough.mov.
Is there a simple mechanism to force update all files from the cache?
I found the following code on SO and included it in the scripts, expecting it to help. Not sure how needful it is :(
// Application cache refresh
window.addEventListener('load', function(e) {
window.applicationCache.addEventListener('updateready', function(e) {
if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
// Browser downloaded a new app cache.
// Swap it in and reload the page to get the new hotness.
window.applicationCache.swapCache();
if (confirm('A new version of this site is available. Load it?')) {
window.location.reload();
}
} else {
// Manifest didn't changed. Nothing new to server.
}
}, false);
}, false);