HTML5 引入了應(yīng)用程序緩存(Application Cache),這意味著可對(duì) web 應(yīng)用進(jìn)行緩存,并可在沒有因特網(wǎng)連接時(shí)進(jìn)行訪問。
應(yīng)用程序緩存為應(yīng)用帶來三個(gè)優(yōu)勢(shì):
表格中的數(shù)字指示完全支持應(yīng)用程序緩存的首個(gè)瀏覽器版本。
API | |||||
Application Cache | 4.0 | 10.0 | 3.5 | 4.0 | 11.5 |
下例展示了帶有 cache manifest 的 HTML 文檔(供離線瀏覽):
<!DOCTYPE HTML>
<html manifest="demo.appcache"
>
<body>
文檔內(nèi)容 ......
</body>
</html>
如需啟用應(yīng)用程序緩存,請(qǐng)?jiān)谖臋n的 <html> 標(biāo)簽中包含 manifest 屬性:
<!DOCTYPE HTML>
<html manifest="demo.appcache"
>
...
</html>
每個(gè)指定了 manifest 的頁面在用戶對(duì)其訪問時(shí)都會(huì)被緩存。如果未指定 manifest 屬性,則頁面不會(huì)被緩存(除非在 manifest 文件中直接指定了該頁面)。
manifest 文件的建議文件擴(kuò)展名是:".appcache"。
注意:manifest 文件需要設(shè)置正確的 MIME-type,即 "text/cache-manifest"。必須在 web 服務(wù)器上進(jìn)行配置。
manifest 文件是簡(jiǎn)單的文本文件,它告知瀏覽器被緩存的內(nèi)容(以及不緩存的內(nèi)容)。
manifest 文件有三個(gè)部分:
第一行,CACHE MANIFEST,是必需的:
CACHE MANIFEST
/theme.css
/logo.gif
/main.js
上面的 manifest 文件列出了三個(gè)資源:一個(gè) CSS 文件,一個(gè) GIF 圖像,以及一個(gè) JavaScript 文件。當(dāng) manifest 文件被加載后,瀏覽器會(huì)從網(wǎng)站的根目錄下載這三個(gè)文件。然后,無論用戶何時(shí)與因特網(wǎng)斷開連接,這些資源依然可用。
下面的 NETWORK 部分規(guī)定文件 "login.php" 永遠(yuǎn)不會(huì)被緩存,且離線時(shí)是不可用的:
NETWORK:
login.asp
可以使用星號(hào)來指示所有其他其他資源/文件都需要因特網(wǎng)連接:
NETWORK:
*
FALLBACK
下面的 FALLBACK 部分規(guī)定如果無法建立因特網(wǎng)連接,則用 "offline.html" 替代 /html/ 目錄中的所有文件:
FALLBACK:
/html/ /offline.html
注釋:第一個(gè) URI 是資源,第二個(gè)是替補(bǔ)。
一旦應(yīng)用被緩存,它就會(huì)保持緩存直到發(fā)生下列情況:
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html/ /offline.html
提示:以 "#" 開頭的是注釋行,但也可滿足其他用途。應(yīng)用的緩存只會(huì)在其 manifest 文件改變時(shí)被更新。如果您編輯了一幅圖像,或者修改了一個(gè) JavaScript 函數(shù),這些改變都不會(huì)被重新緩存。更新注釋行中的日期和版本號(hào)是一種使瀏覽器重新緩存文件的辦法。
請(qǐng)留心緩存的內(nèi)容。
一旦文件被緩存,則瀏覽器會(huì)繼續(xù)展示已緩存的版本,即使您修改了服務(wù)器上的文件。為了確保瀏覽器更新緩存,您需要更新 manifest 文件。
注釋:瀏覽器對(duì)緩存數(shù)據(jù)的容量限制可能不太一樣(某些瀏覽器的限制是每個(gè)站點(diǎn) 5MB)。
如對(duì)本文有疑問,請(qǐng)?zhí)峤坏浇涣髡搲?,廣大熱心網(wǎng)友會(huì)為你解答??! 點(diǎn)擊進(jìn)入論壇