离线缓存更新实现

一旦文件被缓存，浏览器将会持续地显示缓存版本内容。为了让浏览器更新缓存，你需要修改 manifest 文件。

更新 HTML5 离线缓存有 3 种方法

清除离线存储的数据。这个不一定就是清理浏览器历史记录就可以做到的，因为不同浏览器管理离线存储的方式不同。例如，在 Firefox 中需要选择【选项】 | 【高级】 | 【网络】 | 【脱机存储】命令，然后在其中清除离线存储数据
修改 manifest 文件。修改了 manifest 文件里所罗列的文件也不会更新缓存，而是要更新 manifest 文件
使用 JavaScript 编写更新程序

一个更新的实现过程大概是这样的：首先调用 applicationCache.update() 使得浏览器开始尝试更新，前提是 manifest 文件是更新过的（如修改 manifest 版本号）；在 applicationCache.status 为 UPDATEREADY 状态时就可以调用 applicationCache.swapCache() 来将旧的缓存更新为新的。

var appCache = window.applicationCache;
appCache.update();
/* 开始更新  */
if (appCache.status == window.applicationCache.UPDATEREADY) {
  appCache.swapCache();
  // 得到最新版本缓存列表，并且成功下载资源，更新缓存到最新
}

更新过程也可以很简单，但是一个好的应用少不了容错处理，如 Ajax 技术一样，需要对更新过程进行监控，处理各种异常或提示等待状态来使 Web 应用更强壮、用户体验更好，因此需要了解 applicationCache 的更新过程所触发的事件，主要包括 onchecking 、 onerror 、 onnoupdate 、 ondownloading 、 onprogress 、 onupdateready 、 oncached 和 onobsolete 。

简单地说只需要 3 步。

配置服务器 manifest 文件的 MIME 类型
编写 manifest 文件
在页面的 html 元素的 manifest 属性中引用 manifest 文件

更新缓存文件

更新缓存资源主要有两种方法，即通过修改配置文件的版本号或调用 JavaScript 完成更新。

使用 JavaScript 更新方法
当 manifest 文件列表并没有变化的时候，我们通常通过修改 manifest 注释的方式来改变文件，从而实现更新， manifest 注释改变就是指配置文件的版本号

if (window.applicationCache.status === window.applicationCache.UPDATEREADY) {
  window.applicationCache.update();
}

更新缓存文件​

更新缓存文件