HTML5簡明教程(五)離線應(yīng)用

HTML5支持離線功能,當(dāng)網(wǎng)絡(luò)不可用時(shí),網(wǎng)頁還能夠正常訪問,部分功能還將繼續(xù)使用。實(shí)現(xiàn)離線應(yīng)用,最重要的是緩存資源,因此,離線應(yīng)用核心需要定義一份描述文件,指定需要緩存的具體資源。

創(chuàng)建離線應(yīng)用的三個(gè)步驟如下:

1. 創(chuàng)建描述文件

描述文件是一個(gè)以.manifest.appcache為后綴的文本文件,其列出了所有需要緩存的內(nèi)容。

描述文件第一行必須是CACHE MANIFEST,#代表注釋。

CACHE MANIFEST

index.html

# styles & scripts
script.js
style.css

# images
images/bg.png

# FALLBACK指定后備資源
# 在線狀態(tài)使用page.html,離線狀態(tài)使用page_offline.html
FALLBACK:
page.html page_offline.html

# NETWORK指定不緩存的資源
# * 的含義為:除了上面列出的資源,其他資源都需要從Web服務(wù)器下載
NETWORK:
*

2. 引用描述文件

修改口入主頁面,引用描述文件,這樣,瀏覽器在請求頁面時(shí)會(huì)下載描述文件。

<!DOCTYPE html>
<html lang="en" manifest="test.manifest">
...
</html>

3. 配置Web服務(wù)器

Web服務(wù)器必須以正確的MIME類型提供描述文件,即,response的content-type屬性值必須是text/cache-manifest。

如果Web服務(wù)器以其他格式返回描述文件,瀏覽器會(huì)忽略該文件。

maifest.png

下一節(jié):HTML5簡明教程(六)Web Socket和Web Worker

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

相關(guān)閱讀更多精彩內(nèi)容

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