HTML5應(yīng)用程序緩存分析

　　使用HTML5，通過創(chuàng)建cachemanifest文件，可以輕松地創(chuàng)建web應(yīng)用的離線版本。什么是應(yīng)用程序緩存(ApplicationCache)?

　　HTML5引入了應(yīng)用程序緩存，這意味著web應(yīng)用可進(jìn)行緩存，并可在沒有因特網(wǎng)連接時(shí)進(jìn)行訪問。

　　應(yīng)用程序緩存為應(yīng)用帶來三個(gè)優(yōu)勢：

　　離線瀏覽-用戶可在應(yīng)用離線時(shí)使用它們

　　速度-已緩存資源加載得更快

　　減少服務(wù)器負(fù)載-瀏覽器將只從服務(wù)器下載更新過或更改過的資源。

　　瀏覽器支持

　　所有主流瀏覽器均支持應(yīng)用程序緩存，除了InternetExplorer。HTML5CacheManifest實(shí)例

　　下面的例子展示了帶有cachemanifest的HTML文檔(供離線瀏覽)：

　　實(shí)例

　　Thecontentofthedocument......

　　親自試一試CacheManifest基礎(chǔ)

　　如需啟用應(yīng)用程序緩存，請?jiān)谖臋n的標(biāo)簽中包含manifest屬性：

　　...

　　每個(gè)指定了manifest的頁面在用戶對其訪問時(shí)都會(huì)被緩存。如果未指定manifest屬性，則頁面不會(huì)被緩存(除非在manifest文件中直接指定了該頁面)。

　　manifest文件的建議的文件擴(kuò)展名是：".appcache"。

　　請注意，manifest文件需要配置正確的MIME-type，即"text/cache-manifest"。必須在web服務(wù)器上進(jìn)行配置。Manifest文件

　　manifest文件是簡單的文本文件，它告知瀏覽器被緩存的內(nèi)容(以及不緩存的內(nèi)容)。

　　manifest文件可分為三個(gè)部分：

　　CACHEMANIFEST-在此標(biāo)題下列出的文件將在首次下載后進(jìn)行緩存

　　NETWORK-在此標(biāo)題下列出的文件需要與服務(wù)器的連接，且不會(huì)被緩存

　　FALLBACK-在此標(biāo)題下列出的文件規(guī)定當(dāng)頁面無法訪問時(shí)的回退頁面(比如404頁面)

　　CACHEMANIFEST

　　第一行，CACHEMANIFEST，是必需的：

　　CACHEMANIFEST

　　/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

　　下面的NETWORK小節(jié)規(guī)定文件"login.asp"永遠(yuǎn)不會(huì)被緩存，且離線時(shí)是不可用的：

　　NETWORK:

　　login.asp

　　可以使用星號來指示所有其他資源/文件都需要因特網(wǎng)連接：

　　NETWORK:

　　*

　　FALLBACK

　　下面的FALLBACK小節(jié)規(guī)定如果無法建立因特網(wǎng)連接，則用"offline.html"替代/html5/目錄中的所有文件：

　　FALLBACK:

　　/html5//404.html

　　注釋：第一個(gè)URI是資源，第二個(gè)是替補(bǔ)。更新緩存

　　一旦應(yīng)用被緩存，它就會(huì)保持緩存直到發(fā)生下列情況：

　　用戶清空瀏覽器緩存

　　manifest文件被修改(參閱下面的提示)

　　由程序來更新應(yīng)用緩存

　　實(shí)例-完整的Manifest文件

　　CACHEMANIFEST

　　#2012-02-21v1.0.0

　　/theme.css

　　/logo.gif

　　/main.js

　　NETWORK:

　　login.asp

　　FALLBACK:

　　/html5//404.html

　　重要的提示：以"#"開頭的是注釋行，但也可滿足其他用途。應(yīng)用的緩存會(huì)在其manifest文件更改時(shí)被更新。如果您編輯了一幅圖片，或者修改了一個(gè)JavaScript函數(shù)，這些改變都不會(huì)被重新緩存。更新注釋行中的日期和版本號是一種使瀏覽器重新緩存文件的辦法。關(guān)于應(yīng)用程序緩存的注釋

　　一旦文件被緩存，則瀏覽器會(huì)繼續(xù)展示已緩存的版本，即使您修改了服務(wù)器上的文件。為了確保瀏覽器更新緩存，您需要更新manifest文件。

　　注釋：瀏覽器對緩存數(shù)據(jù)的容量限制可能不太一樣(某些瀏覽器設(shè)置的限制是每個(gè)站點(diǎn)5MB)。

　　最后想要工作不累就要不斷的提升自己的技能，想要快速學(xué)習(xí)HTML5開發(fā)就到由專業(yè)老師授課的扣丁學(xué)堂學(xué)習(xí)吧?？鄱W(xué)堂還有名師錄制的HTML5視頻教程供學(xué)員觀看學(xué)習(xí)，想要HTML5視頻教程的小伙伴快咨詢我們的專業(yè)老師索要吧?？鄱W(xué)堂H5技術(shù)交流群：751662650。