HTML5 applicationCache 對(duì)象
applicationCache對(duì)象代表本地緩存,可以用它來(lái)通知用戶本地緩存已經(jīng)被更新,也允許用戶手工更新本地緩存。在瀏覽器與服務(wù)器的交互過(guò)程中,當(dāng)瀏覽器對(duì)本地緩存進(jìn)行更新并加入新的資源文件時(shí),會(huì)觸發(fā)applicationCache對(duì)象的updateready事件,通知本地緩存已經(jīng)被更新??梢岳迷撌录嬖V用戶本地緩存已經(jīng)被更新,用戶需要手工刷新頁(yè)面來(lái)得到最新版本的應(yīng)用程序,代碼如下:
applicationCache.addEventListener("updateready", function(event) {
// 本地緩存已鉍寅新,通知用戶。
alert("本地緩存已被更新,可以刷新頁(yè)面來(lái)得到本程序的最新版本。");
},false);
另外,可以通過(guò)applicationCache對(duì)象的swapCache()方法,來(lái)控制如何進(jìn)行本地緩存的更新及更新的時(shí)機(jī),代碼如下:
swapCache()方法
該方法用來(lái)手工執(zhí)行本地緩存的更新,它只能在applicationCache對(duì)象的updateReady事件被觸發(fā)時(shí)調(diào)用。updateReady事件只有在服務(wù)器上的manifest文件被更新,并且把manifest文件中所要求的資源文件下載到本地后觸發(fā)。該事件的含義是“本地緩存準(zhǔn)備被更新”。當(dāng)這個(gè)事件被觸發(fā)后,可以用swapCacheO方法來(lái)手工進(jìn)行本地緩存的更新。
如果本地緩存的容量非常大,本地緩存的更新工作將需要相對(duì)較長(zhǎng)的時(shí)間,而且會(huì)把瀏覽器鎖住。這時(shí)最好有個(gè)提示,告訴用戶正在進(jìn)行本地緩存的更新,代碼如下:
applicationCache.addEventliistener("updateready", function(event) {
// 本地緩存已被更新,通知用戶。
alert("正在更新本地緩存……");
applicationGaphe.swjap.Giacihe();
alert("本地緩存更新完畢,可以刷新頁(yè)面使用最新版應(yīng)用程序?!保?
},false) ;
在以上代碼中,如果不使用swapCacheO方法,本地緩存一樣會(huì)被更新,但是更新的時(shí)候不一樣。如果不調(diào)用該方法,本地緩存將在下一次打開(kāi)本頁(yè)面時(shí)被更新;如果調(diào)用該方法,則本地緩存將會(huì)被立刻更新。因此,可以使用confirm()方法讓用戶選擇更新時(shí)機(jī),是立刻,還是下次打開(kāi)頁(yè)面時(shí)更 新,特別是當(dāng)用戶可能正在頁(yè)面上執(zhí)行一個(gè)較大操作的時(shí)候。
另外,盡管使用swapCacheO方法立刻更新了本地緩存,但是并不意味著我們頁(yè)面上的圖像和腳本文件也會(huì)被立刻更新,它們都是在重新打開(kāi)本頁(yè)面時(shí)才會(huì)生效。下面是較完整的示例,HTML代碼如下:
<!DOCTYPE html>
<html manifest="swapCache.manifest">
<head>
<meta charset="UTF-8"/>
<title>swapCache()方法示例</title>
<script type="text/JavaScript" src= "js/script.js"></script>
</head〉
<body>
<p>swapCache()方法不例。</p>
</body>
</html>
JS代碼如下:
document.addEventListener ("load",function(event) {
setInterval(function() {
// 手工檢查是否有更新
applicationCache.update();
}, 5000);
applicationCache.addEventListener("updateready", function(event) {
if(confirm("本地緩存已被更新,需要刷新頁(yè)面獲取最新版本嗎?"){
//手工更新本地緩存
applicationCache.swapCache();
//重載頁(yè)面
location.reload();
}
}, false);
});
該頁(yè)面使用的manifest文件的內(nèi)容如下:
Txt代碼
CACHE MANIFEST
#version 1.20
CACHE:
script.js
點(diǎn)擊加載更多評(píng)論>>