applicationCache对象的事件详解

ApplicationCache对象除了有update方法与swapCache方法外，还有一系列的事件。下面通过浏览器与服务器的交互过程来看看这些事件是如何被触发的。

首次访问网站时，事件被触发的过程如下：

（1）浏览器请求访问网站。

（2）服务器返回请求网页，例如index.html。

（3）浏览器发现该网页具有manifest属性，触发checking事件，检查manifest文件是否存在。不存在时，触发error事件，表示未找到manifest文件，不执行步骤（6）。

（4）浏览器解析index.html网页，请求页面上的所有资源文件。

（5）服务器返回所有资源文件。

（6）浏览器处理manifest文件，请求manifest中所有要求本地缓存的文件，包括index.html页面本身，即使刚才已经请求过该文件。如果要求本地缓存所有文件，这将是一个比较大的重复的请求过程；

（7）服务器返回所有要求本地缓存的文件。

（8）浏览器触发downloading事件，然后开始下载这些资源。在下载的同时，周期性地触发progress事件，开发人员可以用编程的手段获取多少文件已被下载，多少文件仍然处于下载队列等信息。

（9）下载结束后触发checked事件，表示首次缓存成功，存入所有要求本地缓存的资源文件。(www.xing528.com)

再次访问网站，步骤（1）～（5）同上，在步骤（5）执行完之后，浏览器将核对manifest文件是否被更新，若没有被更新，则触发noupdate事件，步骤（6）开始的交互过程不会被执行。如果它被更新了，将继续执行后面的步骤，在步骤（9）中不触发checked事件，而是触发updateready事件，这表示下载结束，可以通过刷新页面来使用更新后的本地缓存，或调用swapCache（）方法来立刻使用更新后的本地缓存。

另外，在访问缓存名单时如果返回一个HTTP404错误（页面未找到）或者401错误（永久消失），则触发obsolete事件。

在整个过程中，如果任何与本地缓存有关的处理发生错误的话，它们都会触发error事件。可能会触发error事件的情况分为以下几种：

（1）缓存名单返回一个HTTP404错误或HTTP401错误；

（2）缓存名单被找到且没有被更改，但引用缓存名单的HTML页面不能正确下载；

（3）缓存名单被找到且被更改，但浏览器不能下载某个缓存名单中列出的资源；

（4）开始更新本地缓存时，缓存名单再次被更改。

下面是一个完整的使用swapCache方法的实例。在该实例中，使用到了applicationCache对象的另一个方法applicationCache.update，该方法的作用是检查服务器上的manifest文件是否被更新。在打开画面时设定了3秒钟执行一次该方法，检查服务器上的manifest文件是否被更新。如果被更新，浏览器会自动下载manifest文件中所有请求本地缓存的资源文件，当这些资源文件下载完毕时，会触发updateReady事件，询问用户是否立刻刷新页面以使用最新版本的应用程序，如果用户选择立刻刷新，则调用swapCache方法手工更新本地缓存，更新完毕后刷新页面。程序代码如下：

其运行结果如图10.4所示。

图10.4　applicationCache事件流程实例