?
This document uses PHP Chinese website manual Release
Deprecated
該功能已從Web標準中刪除。盡管一些瀏覽器可能仍然支持它，但它正在被丟棄。避免使用它并盡可能更新現(xiàn)有的代碼；請參閱本頁底部的兼容性表格來指導您的決定。請注意，此功能可能隨時停止工作。
使用此處描述的應用程序緩存功能在這一點上非常令人沮喪；它正在從Web平臺中移除。改用服務人員。事實上，從Firefox 44開始，當AppCache用于為頁面提供脫機支持時，控制臺中現(xiàn)在會顯示一條警告消息。
介紹
HTML5提供了一種應用程序緩存機制，可讓基于Web的應用程序脫機運行。開發(fā)人員可以使用應用程序緩存（AppCache）界面來指定瀏覽器應緩存的資源并使其可供離線用戶使用。即使用戶在脫機狀態(tài)下單擊刷新按鈕，緩存的應用程序也會正常加載并正常工作。
使用應用程序緩存為應用程序提供了以下好處：
離線瀏覽：用戶即使在離線時也可以瀏覽網(wǎng)站。
速度：緩存的資源是本地的，因此加載速度更快。
降低服務器負載：瀏覽器僅下載從服務器更改的資源。
應用程序緩存如何工作
啟用應用程序緩存
要為應用程序啟用應用程序緩存，必須在應用程序頁面manifest的<html>元素中包含該屬性，如以下示例所示：
<html manifest="example.appcache"> ...</html>
清單屬性引用緩存清單文件，該文件是列出瀏覽器應為應用程序緩存的資源（文件）的文本文件。
您應該manifest在應用程序的每個頁面上包含要緩存的屬性。瀏覽器不會緩存不包含manifest屬性的頁面，除非這些頁面明確列在清單文件本身中。您不需要列出要在清單文件中緩存的所有頁面，瀏覽器會隱式添加用戶訪問的每個頁面，并將manifest屬性設置為應用程序緩存。
某些瀏覽器（例如Firefox）會在用戶首次加載使用應用程序緩存的應用程序時顯示通知欄。通知欄顯示一條消息，例如：
本網(wǎng)站（www.example.com）要求將數(shù)據(jù)存儲在您的計算機上供脫機使用。現(xiàn)在不允許
術語“脫機（啟用）應用程序”有時專指用戶已允許使用脫機功能的應用程序。
加載文件
使用應用程序緩存修改了加載文檔的正常過程：
如果應用程序緩存存在，則瀏覽器直接從緩存中加載文檔及其關聯(lián)資源，而不訪問網(wǎng)絡。這加快了文檔加載時間。
然后瀏覽器檢查是否已在服務器上更新緩存清單。
如果緩存清單已更新，瀏覽器會下載清單的新版本和清單中列出的資源。這是在后臺完成的，不會顯著影響性能。
下面更詳細地指定加載文檔和更新應用程序緩存的過程：
當瀏覽器訪問包含
manifest屬性的文檔時，如果沒有應用程序緩存存在，瀏覽器將加載文檔，然后獲取清單文件中列出的所有條目，從而創(chuàng)建應用程序緩存的第一個版本。對該文檔的后續(xù)訪問會導致瀏覽器從應用程序緩存（而不是從服務器）加載清單文件中指定的文檔和其他資產(chǎn)。另外，瀏覽器還會向對象發(fā)送一個
checking事件window.applicationCache，并根據(jù)適當?shù)腍TTP緩存規(guī)則獲取清單文件。如果清單的當前緩存副本是最新的，則瀏覽器
noupdate向該applicationCache對象發(fā)送一個事件，并且更新過程完成。請注意，如果您更改服務器上的任何緩存資源，則還必須更改清單文件本身，以便瀏覽器知道它需要再次獲取所有資源。如果清單文件已更改，則清單中列出的所有文件（以及通過調用添加到高速緩存的文件
applicationCache.add()）都會根據(jù)相應的HTTP高速緩存規(guī)則提取到臨時高速緩存中。對于每個獲取到該臨時緩存中的文件，瀏覽器都會progress向該applicationCache對象發(fā)送一個事件。如果發(fā)生任何錯誤，瀏覽器將發(fā)送一個error事件，并停止更新。一旦成功檢索到所有文件，它們就會自動移入真正的脫機緩存中，并將
cached事件發(fā)送到applicationCache對象。由于文檔已經(jīng)從緩存中加載到瀏覽器中，所以在文檔重新加載（手動或編程）之前，更新的文檔將不會被渲染。
存儲位置并清除脫機緩存
在Chrome中，您可以通過在首選項中選擇“清除瀏覽數(shù)據(jù)...”或通過訪問chrome://appcache-internals/來清除脫機緩存。Safari在其偏好設置中有類似的“空緩存”設置，但也可能需要重啟瀏覽器。
在Firefox中，脫機緩存數(shù)據(jù)與Firefox配置文件分開存儲 - 位于常規(guī)磁盤緩存旁邊：
Windows Vista/7:
C:\Users\<username>\AppData\Local\Mozilla\Firefox\Profiles\<salt>.<profile name>\OfflineCacheMac/Linux:
/Users/<username>/Library/Caches/Firefox/Profiles/<salt>.<profile name>/OfflineCache
在Firefox中，可以在about:cache頁面上檢查脫機緩存的當前狀態(tài)（在“脫機緩存設備”標題下）?？梢允褂霉ぞ?- >選項 - >高級 - >網(wǎng)絡 - >離線數(shù)據(jù)中的“刪除...”按鈕單獨清除每個站點的脫機緩存。
在Firefox 11之前，無論是工具 - >清除最近的歷史記錄，還是工具 - >選項 - >高級 - >網(wǎng)絡 - >離線數(shù)據(jù) - >立即清除，都會清除離線緩存。這已被修復。
在Linux上，您可以在編輯>首選項>高級>網(wǎng)絡>離線Web內(nèi)容和用戶數(shù)據(jù)中找到該設置
另請參閱清除DOM存儲數(shù)據(jù)。
應用程序緩存也可能過時。如果從服務器中刪除應用程序的清單文件，瀏覽器將刪除使用該清單的所有應用程序緩存，并向該applicationCache對象發(fā)送“已廢棄”事件。這將應用程序緩存的狀態(tài)設置為OBSOLETE。
緩存清單文件
引用緩存清單文件
manifestWeb應用程序中的屬性可以指定緩存清單文件的相對路徑或絕對URL。（絕對URL必須來自與應用程序相同的來源）。緩存清單文件可以具有任何文件擴展名，但它必須以MIME類型提供text/cache-manifest。
注意：在Apache服務器上，清單（.appcache）文件的MIME類型可以通過添加AddType text/cache-manifest .appcache到根目錄或與應用程序相同的目錄中的.htaccess文件來設置。
緩存清單文件中的條目
緩存清單文件是一個簡單的文本文件，列出了瀏覽器為了離線訪問而緩存的資源。資源由URI標識。緩存清單中列出的條目必須與清單具有相同的方案，主機和端口。
例1：一個簡單的緩存清單文件
以下是一個簡單的緩存清單文件example.appcache，適用于www.example.com上的虛擬網(wǎng)站。
CACHE MANIFEST # v1 - 2011-08-13# This is a comment.http://www.example.com/index.html http://www.example.com/header.png http://www.example.com/blah/blah
緩存清單文件可以包括三個部分（CACHE，NETWORK，和FALLBACK，在下面討論）。在上面的示例中，沒有節(jié)頭，因此假定所有數(shù)據(jù)行都位于explicit（CACHE）節(jié)中，這意味著瀏覽器應將所有列出的資源緩存在應用程序緩存中。資源可以使用絕對或相對URL（例如，index.html）指定。
上例中的“v1”注釋有一個很好的理由。清單文件更改時，瀏覽器僅更新應用程序緩存，字節(jié)為字節(jié)。如果更改緩存的資源（例如，header.png用新內(nèi)容更新映像），則還必須更改清單文件的內(nèi)容，以便讓瀏覽器知道他們需要刷新緩存。您可以對清單文件進行任何更改，但建議最佳做法是修改版本號。
重要提示：不要在緩存清單文件中指定清單本身，否則幾乎不可能通知瀏覽器新的清單可用。
在緩存清單文件的部分：CACHE，NETWORK，和FALLBACK
清單可以有三個不同的部分：CACHE，NETWORK，和FALLBACK。
CACHE:這是緩存清單文件中條目的默認部分。在CACHE:部分標題下（或直接在該CACHE MANIFEST行后面）列出的文件在第一次下載后被顯式緩存。緩存清單文件中NETWORK:的NETWORK:部分標題下列出的文件是需要連接到服務器的白名單資源。即使用戶處于離線狀態(tài)，對這些資源的所有請求都會繞過緩存。通配符*可以使用一次。大多數(shù)網(wǎng)站需要*。FALLBACK:該FALLBACK:部分指定瀏覽器在資源不可訪問時應使用的備用頁面。本節(jié)中的每個條目都列出了兩個URI--第一個是資源，第二個是后備。這兩個URI必須是相對的，并且來自清單文件的相同來源。可以使用通配符。
CACHE，NETWORK和FALLBACK部分可以在高速緩存中的清單文件的任何順序排列，并且各部分可以在單一清單中出現(xiàn)一次以上。
示例2：更完整的緩存清單文件
以下是www.example.com上虛構網(wǎng)站的更完整的緩存清單文件：
CACHE MANIFEST # v1 2011-08-14# This is another comment index.html cache.html style.css image1.png # Use from network if available NETWORK:network.html # Fallback content FALLBACK:. fallback.html
本例使用NETWORK和FALLBACK部分指定的network.html頁面必須始終從網(wǎng)絡檢索，并且該fallback.html頁面應該充當后備資源（例如，在情況下與服務器的連接不能建立）。
緩存清單文件的結構
緩存清單文件必須以text/cache-manifestMIME類型提供。使用此MIME類型提供的所有資源必須遵循本節(jié)中定義的應用程序緩存清單的語法。
高速緩存清單是UTF-8格式的文本文件，可以選擇包含BOM字符。換行符可以由換行符（U+000A），回車符（U+000D）或回車符和換行符來表示。
緩存清單的第一行必須包含字符串CACHE MANIFEST（U+0020兩個單詞之間有一個空格），后跟零個或多個空格或制表符。該行上的任何其他文本都將被忽略。
緩存清單的其余部分必須包含零個或多個以下行：
空白行您可以使用由零個或多個空格和制表符組成的characters.CommentComments包含零個或多個制表符或空格，后跟單個#字符，后跟零個或多個注釋文本字符。注釋只能用于他們自己的行（在第一CACHE MANIFEST行之后），不能附加到其他行。這意味著您無法指定片段標識符。部分headerSection標頭指定正在處理緩存清單的哪一部分。有三種可能的部分標題：
節(jié)標題說明`CACHE：`切換到緩存清單的顯式部分（這是默認部分）。`NETWORK：`切換到緩存清單的在線白名單部分。`FALLBACK：`切換到緩存清單的后備部分。
部分標題行可能包含空格，但必須:在部分名稱中包含冒號 (:)。部分數(shù)據(jù)數(shù)據(jù)行的格式因部分而異。在explicit（CACHE:）部分中，每行都是要緩存的資源的有效URI或IRI引用（本節(jié)中不允許使用通配符）。在每行的URI或IRI之前和之后允許使用空格。在Fallback部分中，每一行都是對資源的有效URI或IRI引用，隨后是在無法與服務器建立連接時要提供的后備資源。在網(wǎng)絡部分，每一行都是一個有效的URI或IRI引用，用于從網(wǎng)絡中獲取資源（或者*可以在本節(jié)中使用通配符）。
注意：相對URI與緩存清單的URI相關，而不是引用清單的文檔的URI。
高速緩存清單文件可以隨意從節(jié)段切換到節(jié)段（每節(jié)段標題可以多次使用），并且節(jié)段允許為空。
應用程序緩存中的資源
應用程序緩存始終包含至少一個由URI標識的資源。所有資源都適用于以下類別之一：
主條目這些是添加到緩存的資源，因為用戶訪問的瀏覽上下文包含一個文檔，該文檔使用其manifest屬性指示它位于此緩存中。隱式條目這些是在應用程序的緩存清單文件中明確列出的資源。網(wǎng)絡條目這些是應用程序的緩存清單文件作為網(wǎng)絡條目?；赝藯l目這些是在應用程序的緩存清單文件中列為備用條目的資源。
注意：資源可以使用多個類別進行標記，因此可以分類為多個條目。例如，一個條目既可以是顯式條目又可以是后備條目。
下面將更詳細地描述資源類別。
主條目
主條目是manifest在其<html>元素中包含屬性的任何HTML文件。例如，假設我們有HTML文件http://www.example.com/entry.html，它看起來像這樣：
<html manifest="example.appcache"> <h1>Application Cache Example</h1></html>
如果entry.html未在example.appcache緩存清單文件中列出，則訪問該entry.html頁面會導致entry.html作為主條目添加到應用程序緩存中。
顯式條目
顯式條目是在CACHE緩存清單文件的部分中明確列出的資源。
網(wǎng)絡條目
NETWORK緩存清單文件的部分指定了Web應用程序需要聯(lián)機訪問的資源。應用程序緩存中的網(wǎng)絡條目本質上是“在線白名單” - 該NETWORK節(jié)中指定的URI 從服務器而不是緩存中加載。這可以讓瀏覽器的安全模型通過限制對已批準資源的訪問來保護用戶免受潛在的安全漏洞攻擊。
作為示例，您可以使用網(wǎng)絡條目從服務器（而不是緩存）加載和執(zhí)行腳本和其他代碼：
CACHE MANIFEST NETWORK:/api
上面列出的緩存清單部分確保加載http://www.example.com/api/子樹中包含的資源的請求始終訪問網(wǎng)絡，而不嘗試訪問緩存。
注意：從清單文件中簡單省略主條目（manifest在html元素中設置了屬性的文件）將不會有相同的結果，因為主條目將被添加到應用程序緩存中，并隨后從該應用程序緩存中提供。
后備條目
當嘗試加載資源失敗時使用回退條目。例如，假設緩存清單文件http://www.example.com/example.appcache包含以下內(nèi)容：
CACHE MANIFEST FALLBACK:example/bar/ example.html
對其http://www.example.com/example/bar/或其任何子目錄及其內(nèi)容的任何請求都會導致瀏覽器發(fā)出網(wǎng)絡請求以嘗試加載所請求的資源。如果嘗試失敗，由于網(wǎng)絡故障或某種服務器錯誤，瀏覽器會加載example.html文件。
緩存狀態(tài)
每個應用程序緩存都有一個狀態(tài)，用于指示緩存的當前狀態(tài)。共享相同清單URI的緩存共享相同的緩存狀態(tài)，可以是以下之一：
UNCACHED指示應用程序緩存對象未完全初始化的特殊值。IDLE應用程序緩存當前未處于更新過程中。CHECKING清單正在提取并檢查更新。DOWNLOADING由于資源清單發(fā)生變化，正在下載資源以添加到緩存中。UPDATEREADY有一個新版本的應用程序緩存可用。有一個相應的updateready事件，cached當一個新的更新被下載但尚未使用該swapCache()方法激活時，將被觸發(fā)而不是事件。OBSOLETE應用程序緩存組現(xiàn)在已經(jīng)過時。
測試緩存清單的更新
您可以使用JavaScript以編程方式測試以查看應用程序是否具有更新的緩存清單文件。由于緩存清單文件在腳本附加事件偵聽器以測試更新之前可能已更新，因此腳本應始終測試window.applicationCache.status。
function onUpdateReady() {
console.log('found new version!');}window.applicationCache.addEventListener('updateready', onUpdateReady);if(window.applicationCache.status === window.applicationCache.UPDATEREADY) { onUpdateReady();}要手動開始測試新清單文件，可以使用window.applicationCache.update()。
陷阱
永遠不要使用傳統(tǒng)的GET參數(shù)來訪問緩存的文件（如
other-cached-page.html?parameterName=value）。這將使瀏覽器繞過緩存并嘗試從網(wǎng)絡獲取它。要鏈接到具有JavaScript解析參數(shù)的緩存資源，請在鏈接的散列部分使用參數(shù)，例如other-cached-page.html#whatever?parameterName=value。當緩存應用程序時，僅更新網(wǎng)頁中使用的資源（文件）不足以更新已緩存的文件。您必須在瀏覽器檢索并使用更新的文件之前更新緩存清單文件本身。
window.applicationCache.swapCache()盡管已經(jīng)加載的資源不會受到影響，但您可以通過編程方式使用此功能。為了確保從新版本的應用程序緩存中加載資源，刷新頁面非常理想。在您的Web服務器上設置過期標題
*.appcache以便立即過期的文件是個好主意。這樣可以避免緩存清單文件的風險。例如，在Apache中，您可以指定如下配置：ExpiresByType text/cache-manifest "access plus 0 seconds"
瀏覽器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
Basic support | 4.0 | (Yes) | 3.5 (1.9.1)1 | 10.0 | 10.6 | 4.0 |
Feature | Android | Edge | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
Basic support | 2.1 | (Yes) | (Yes) | 1.0.12 | 11.03 | 11.0 | 3.2 |