**干什么用的？
**
離線緩存為的是第一次請求后，根據(jù)manifest文件進行本地緩存，并且在下一次請求后進行展示（若有緩存的話，無需再次進行請求而是直接調(diào)用緩存），最根本的感覺是它使得WEB從online可以延伸到了offline領(lǐng)域。
應(yīng)用場景
h5游戲及一些頁面內(nèi)容不經(jīng)常會變動，相對較為固定的內(nèi)容。
怎么用的？
若想使用manifest功能，需要在需要進行緩存功能的html文件之中寫入 聲明
<meta manifest = ‘demo.appcache’> // 這個文件格式是官方推薦的
這里，若遇到如此報錯
Application Cache Error event: Manifest fetch failed (404)
其原因是因為 manifest文件需要正確的配置MIME-type（描述該消息的媒體類型），即
“text/cache-manifest”，必須在服務(wù)器端進行配置。
manifest文件如何進行配置？
首先manifest分為三個部分
1、CACHE MANIFEST //指出需要進行manifest的文件，此文件將會在首次下載后被緩存下來
CACHE MANIFESTCACHE:/index.css/index.html/index.js
2、NETWORK //指出需要向服務(wù)器請求即不需要manifest的文件，此文件不會被緩存，若為*則表示所有文件均需要進行網(wǎng)絡(luò)請求，而不使用緩存。
NETWORK:*
3、FALLBACK //指出當頁面無法進行訪問時，顯示的頁面（替換的頁面），例子中，當html5文件夾中的文件出現(xiàn)異常情況，，使用404.html頁面替換掉異常頁面 （第一個uri路徑是資源地址，第二個是備胎地址）
FALLBACK:/html5/ /404.html
完整的實例
CACHE MANIFEST# 2017-04-06 v1.0.0
CACHE:/theme.css/logo.gif/main.js
NETWORK:login.asp
FALLBACK:/html5/ /404.html
注意：這里的版本號，是我們?nèi)藶橐?guī)定的，而非是manifest自帶的屬性，當每一次html加載到manifest時，會對manifest配置文件進行臟檢查，當檢測到manifest文件被修改后，之前的緩存將會被棄用，轉(zhuǎn)而去根據(jù)manifest文件中配置的新內(nèi)容進行緩存。
查看：
被緩存的文件可以使用谷歌瀏覽器進行查看: f12 -> Application -> Application Cache
ftchinese 手機版使用了離線緩存技術(shù)，可以去看下其源碼以及緩存的文件是如何進行存儲的
問題！
manifest除了緩存manifest.appcache文件所指定的資源外，還必定會緩存當前的html頁面，即
<meta manifest=‘demo.appcache'>
標簽所在的頁面以及demo.appcache文件里面所規(guī)定的靜態(tài)資源一并存入 application Cache 之中。
當用戶再一次訪問該頁面時，demo.appcache文件之中CACHE MANIFEST所指向的資源就不需要重新進行加載了，但是問題是，當前的html頁面也會跟著cache直接讀出來了，可能會造成即使 我們的頁面更新了，但是用戶還是看的老舊版本頁面（因為更新mainfest的時候，頁面加載已經(jīng)開始了，但是緩存更新卻尚未完成，瀏覽器還是會使用緩存的資源，當瀏覽器檢測到了Application Cache有更新時，本次不會使用新的資源，下一次才會進行使用）
解決方案：
applicationCache.addEventListener("updateready",function(){
applicationCache.swapCache(); // 手工更新本地緩存
location.reload(); //重新加載頁面頁面
},true);````
添加事件監(jiān)聽，當監(jiān)聽到本地緩存更新后，進行重載頁面，以達到更新的目的。
****
**寫在最后：**
**這是本人第一篇簡書，文筆難免稚嫩，希望各位前輩能夠不吝批評與建議，祝各位工作順利。**
