什麽是manifest?
簡單來說manifest能讓妳的應用在無網的情況下也能訪問。
它有三大優勢：
1、離線瀏覽，無網情況下也能正常訪問；
2、更快的加載速度，緩存在本地訪問速度自然更快；
3、減輕服務請求壓力，文件緩存後不需要再次請求，只需要請求需要更新的文件。
如何使用？
XML/HTML Code復制內容到剪貼板
...
妳需要在妳想要緩存的web app的每壹頁中都包含 manifest 屬性。如果壹個頁面沒有 manifest屬性，它將不會被緩存（除非在manifest文件中顯式指定了這 個頁面）。這意味著只要用戶訪問的頁面包含manifest屬性，它都將會被加入application cache中。這樣，就不用在manifest文件中指定需要緩存哪些頁面了。
Manifest屬性可以指定壹個絕對URL或是壹個相對路徑，但是，壹個絕對URL需要和web app是同源的。壹個manifest文件可以是任何擴展文件類型，但必須有正確的mime-type，比如在Apache中添加
AddType text/cache-manifest .appcache?。Manifest文件
manifest 文件是簡單的文本文件，它告知瀏覽器被緩存的內容（以及不緩存的內容）。
manifest 文件可分為三個部分：
CACHE MANIFEST - 在此標題下列出的文件將在首次下載後進行緩存NETWORK - 在此標題下列出的文件需要與服務器的連接，且不會被緩存FALLBACK - 在此標題下列出的文件規定當頁面無法訪問時的回退頁面（比如 404 頁面）
壹個完整的manifest文件：
XML/HTML Code復制內容到剪貼板
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html5/ /404.html
CACHE MANIFEST是必須的，#後面是註釋，下面是需要cache的文件，需要相對路徑，NETWORK是需要每次請求加載的文件。可以使用星號來指示所有其他資源/文件都需要因特網連接：NETWORK:*FALLBACK是如果無法建立因特網連接，則用 "404.html" 替代 /html5/ 目錄中的所有文件。
更新機制有三種方式更新manifest緩存：1、用戶清空瀏覽器緩存；2、manifest文件被修改，哪怕是註釋（所以可以通過修改註釋來更新文件）3、由程序來更新
緩存狀態在程序可以通過window.applicationCache屬性來查看緩存狀態。
C/C++ Code復制內容到剪貼板
var appCache = window.applicationCache;
switch (appCache.status) {
case appCache.UNCACHED: // UNCACHED == 0
return ?UNCACHED?;
break;
case appCache.IDLE: // IDLE == 1
return ?IDLE?;
break;
case appCache.CHECKING: // CHECKING == 2
return ?CHECKING?;
break;
case appCache.DOWNLOADING: // DOWNLOADING == 3
return ?DOWNLOADING?;
break;
case appCache.UPDATEREADY: // UPDATEREADY == 4
return ?UPDATEREADY?;
break;
case appCache.OBSOLETE: // OBSOLETE == 5
return ?OBSOLETE?;
break;
default:
return ?UKNOWN CACHE STATUS?;
break;
};
為了通過編程更新cache，首先調用 applicationCache.update()。這將會試圖更新用戶的 cache（要求manifest文件已經改變）。最後，當 applicationCache.status 處於 UPDATEREADY 狀態時， 調用applicationCache.swapCache()，舊的cache就會被置換成新的。
C/C++ Code復制內容到剪貼板
var appCache = window.applicationCache;
appCache.update(); // Attempt to update the user?s cache.
?
if (appCache.status == window.applicationCache.UPDATEREADY) {
appCache.swapCache(); // The fetch was successful, swap in the new cache.
}
註意：像這樣使用 update()和swapCache()並不會將更新後的資源 呈現給用戶。這僅僅是讓瀏覽器檢查manifest文件是否發生了更新，然後下載指定的更新內容，重新填充app cache。因此，要讓用戶看到更新後的內容，需要兩次頁面下載，壹次是更新app cache，壹次是更新頁面內容。
為了讓用戶能看到妳的站點的最新版本，設置壹個監聽器來監聽頁面加載時的updateready 事件。
C/C++ Code復制內容到剪貼板
// Check if a new cache is available on page load.
window.addEventListener(?load?, function(e) {
window.applicationCache.addEventListener(?updateready?, function(e) {
if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
// Browser downloaded a new app cache.
// Swap it in and reload the page to get the new hotness.
window.applicationCache.swapCache();
window.location.reload();
} else {
// Manifest didn?t changed. Nothing new to server.
}
}, false);
}, false);
監聽事件，對不同的狀態做出相應處理：
C/C++ Code復制內容到剪貼板
var appCache = window.applicationCache;
// Fired after the first cache of the manifest.
appCache.addEventListener(?cached?, handleCacheEvent, false);
// Checking for an update. Always the first event fired in the sequence.
appCache.addEventListener(?checking?, handleCacheEvent, false);
// An update was found. The browser is fetching resources.
appCache.addEventListener(?downloading?, handleCacheEvent, false);
// The manifest returns 404 or 410, the download failed,
// or the manifest changed while the download was in progress.
appCache.addEventListener(?error?, handleCacheError, false);
// Fired after the first download of the manifest.
appCache.addEventListener(?noupdate?, handleCacheEvent, false);
// Fired if the manifest file returns a 404 or 410.
// This results in the application cache being deleted.
appCache.addEventListener(?obsolete?, handleCacheEvent, false);
// Fired for each resource listed in the manifest as it is being fetched.
appCache.addEventListener(?progress?, handleCacheEvent, false);
// Fired when the manifest resources have been newly redownloaded.
appCache.addEventListener(?updateready?, handleCacheEvent, false);
如果manifest文件或者該文件中指定的某個資源下載失敗，那麽整個更新都會失敗。在這種情況下，瀏覽器會繼續試用老的application cache。
註意事項：
1. 站點離線存儲的容量限制是5M2. 如果manifest文件，或者內部列舉的某壹個文件不能正常下載，整個更新過程將視為失敗，瀏覽器繼續全部使用老的緩存3. 引用manifest的html必須與manifest文件同源，在同壹個域下4. 在manifest中使用的相對路徑，相對參照物為manifest文件5. CACHE MANIFEST字符串應在第壹行，且必不可少6. 系統會自動緩存引用清單文件的 HTML 文件7. manifest文件中CACHE則與NETWORK，FALLBACK的位置順序沒有關系，如果是隱式聲明需要在最前面8. FALLBACK中的資源必須和manifest文件同源9. 當壹個資源被緩存後，該瀏覽器直接請求這個絕對路徑也會訪問緩存中的資源。10. 站點中的其他頁面即使沒有設置manifest屬性，請求的資源如果在緩存中也從緩存中訪問11. 當manifest文件發生改變時，資源請求本身也會觸發更新