離線web應(yīng)用 HTML5的離線儲(chǔ)存怎么使用,解釋工作原理

介紹:HTML5新增了‘應(yīng)用程序緩存’,允許web應(yīng)用將應(yīng)用程序自身本地保存到用戶的瀏覽器中,不是像localstorage一樣保存web應(yīng)用程序的相關(guān)數(shù)據(jù),他是將應(yīng)用程序自身保存起來——應(yīng)用程序所需運(yùn)行的所有文件(HTML,CSS,JavaScript、圖片)。應(yīng)用程序緩存和一般瀏覽器緩存不同:不會(huì)隨著用戶清除瀏覽器而被清除,緩存起來的應(yīng)用程序也不會(huì)像一般固定大小的緩存那樣,老數(shù)據(jù)會(huì)被最近一次訪問的新數(shù)據(jù)替代掉,應(yīng)該稱為應(yīng)用程序存儲(chǔ)。

應(yīng)用程序緩存清單文件以.appcache作為擴(kuò)展名,清單文件中的首行內(nèi)容必須要‘CACHE MANIFEST’字符串開始,其余就是要緩存的文件URL列表,一行一個(gè)URL

應(yīng)用程序緩存清單:將應(yīng)用程序安裝到應(yīng)用程序緩存中,首先要?jiǎng)?chuàng)建一個(gè)清單:包含了所有應(yīng)用程序依賴的所有URL列表,然后通過在應(yīng)用程序主HTML頁面的HTML標(biāo)簽中設(shè)置manifest屬性,指向該清單文件即可。

HTML5的離線儲(chǔ)存怎么使用,工作原理能不能解釋一下?

?在用戶沒有與因特網(wǎng)連接時(shí),可以正常訪問站點(diǎn)或應(yīng)用,在用戶與因特網(wǎng)連接時(shí),更新用戶機(jī)器上的緩存文件。

原理:HTML5的離線存儲(chǔ)是基于一個(gè)新建的.appcache文件的緩存機(jī)制(不是存儲(chǔ)技術(shù)),通過這個(gè)文件上的解析清單離線存儲(chǔ)資源,這些資源就會(huì)像cookie一樣被存儲(chǔ)了下來。之后當(dāng)網(wǎng)絡(luò)在處于離線狀態(tài)下時(shí),瀏覽器會(huì)通過被離線存儲(chǔ)的數(shù)據(jù)進(jìn)行頁面展示。

更新緩存:一旦應(yīng)用被緩存,它就會(huì)保持緩存直到發(fā)生下列情況:1.用戶清空瀏覽器緩存2.manifest 文件被修改(參閱下面的提示)3.由程序來更新應(yīng)用緩存

如何使用: 1、頁面頭部像下面一樣加入一個(gè)manifest的屬性;2、在cache.manifest文件的編寫離線存儲(chǔ)的資源;

??????CACHE MANIFEST

??????#v0.11

??????CACHE:

??????js/app.js

??????css/style.css

??????NETWORK:

??????resourse/logo.png

??????FALLBACK:

??????/ /offline.html

????3、在離線狀態(tài)時(shí),操作window.applicationCache進(jìn)行需求實(shí)現(xiàn)。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容