JavaScript 離線應用與客戶端存儲——“應用緩存”的注意要點

vpants 發布于2019-08-19 17:44 / 2363人閱讀

摘要：在線離線應用緩存就是一個從瀏覽器的緩存中分出來的緩存去，在緩存中保存數據，可以使用一個描述文件，列出要下載和緩存的資源。

離線檢測

HTML5中定義的：

navigator.onLine如果為true則表示設備能夠上網注意是大寫的L（onLine）；

用下面代碼檢測屬性狀態：

if (navigator.onLine) {
    // statement if online
} else {
    // statement if offline
}

另外：

window.online和window.offline兩個事件

HTML5提供了這兩個事件，會在網絡狀態變化時觸發。online在網絡由離線變為在線時觸發；offline在網絡由在線變為離線時觸發。

EventUtil.addHandler(window, "online", function() {
    document.getElementById("status").innerHTML = "在線";
});
EventUtil.addHandler(window, "offline", function() {
    document.getElementById("status").innerHTML = "離線";
});

應用緩存(appcache)

appcache就是一個從瀏覽器的緩存中分出來的緩存去，在緩存中保存數據，可以使用一個描述文件（manifest file），列出要下載和緩存的資源。

描述文件文件名：

offline.manifest

描述文件內容：

CACHE MANIFEST
#Comment

file.js
file.css

然后與頁面關聯起來，在html標簽中的manifest屬性中指定這個文件路徑：

另外，applicationCache.status會返回下面的常量：

0：無緩存

1：閑置

2：檢查中

3：下載中

4：更新完成

5：廢棄

應用緩存相關的事件：

checking：檢查緩存更新時；

error：檢查更新或下載資源時發聲錯誤

noupdate：描述文件無變化

downloading：開始下載應用緩存資源

progress：下載緩存資源過程中

updateready：下載完畢

cached：應用緩存完整可用時

讓應用緩存為檢查更新而觸發上述事件：

applicationCache.update();

云服務器 GPU云服務器應用緩存服務器應用緩存服務器配置 javascript的應用離線應用

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78803.html

Javascript--離線應用與客戶端儲存

摘要：在這種情況下，瀏覽器將繼續使用原應用緩存。對象對象有一個屬性，屬性的值是常量，表示應用緩存的狀態。兼容性與其他客戶端儲存方案相比，同樣也有限制，這些限制因瀏覽器圍而異。對象主要用于僅針對會話的小段數據的存儲。開發離線Web應用需要幾個步驟: 首先確保應用知道設備是否能上網。應用必須能訪問一定的資源(圖像,Javascript,CSS)，這樣才能正常工作。離線檢測 naviga...

lmxdawn 2019-08-21 10:50 評論0 收藏0
JS學習筆記（第23章）(離線應用與客戶端存儲1)

摘要：應用緩存的應用緩存，或者簡稱為，是專門為開發離線應用而設計的。應用緩存還有很多相關的事件，表示其狀態的改變。數據存儲，通常直接叫做，最初是在客戶端用于存儲會話信息的。也就是使用值來存儲多個名稱值對兒。所謂Web離線應用，就是在設備不能上網的情況下仍然可以運行的應用。開發離線Web應用需要幾個步驟：（1）確保應用知道設備是否能上網；（2）應用還必須能訪問一定的資源（圖像、JavaScr...

fjcgreat 2019-08-26 13:40 評論0 收藏0
javascript-離線應用于客戶端存儲

摘要：離線檢測含義設備能否上網代碼注和，和最新的沒問題應用緩存緩存的目的是專門為網頁離線設計的，當然在在線情況也會緩存機制當用戶在地址輸入請求的地址去請求網頁時，瀏覽器會先本地緩存中查看是否有對應的緩存文件，如果有然后查看新鮮度就是是否過期了，如 23.1 離線檢測含義：設備能否上網代碼： navigator.onLine 注：IE6+和safari+5，firefox3+和ope...

gecko23 2019-08-23 15:21 評論0 收藏0