HTML5提供了Application Cache機制，可以讓靜態檔案Cache在Client端
減少對Server的Request,加速頁面載入，當網站上資料有異動，需要客戶端
更新Cache資料，也可以很簡易的做到，進一步還可以達到離線閱讀的目的
二.原理
要使用了Application Cache，必須在網站上加上一個manifest檔案
manifest檔案內設定了要cache的檔案清單,當Client連線後會儲存保留
menifest檔案在Client端，每次連線一定會去比對Client端的manifest檔案與
Server端上的manifest檔案是否有異，若有異動，則會重新由Server讀取檔案儲存到Client的Cache，否則就會去直接讀取Client端的Cache顯示頁面資料
三.Web Server上需要的設定
在Web Server上需要對manifest的檔案類型做MIME Type設定
副檔名可以自訂
通常會是用.manifest 或 .appcache
例 在Apache Web Server設定加上
AddType text/cache-manifest .manifest
四.網頁上使用
<html manifest='cache.manifest'>
五.manifest檔案設定內容
CACHE MANIFEST 必要的第一行
CACHE:
區塊設定要cache的檔案清單
NETWORK:
區塊設定一定要由網路讀取的清單
FALLBACK:
區塊設定當讀取失敗，要轉向使用哪個替代內容顯示
CACHE MANIFEST
#ver 0.0.1
CACHE:
index.htm
/js/main.min.js
/css/app.css
/img/btn_img.png
NETWORK:
*
FALLBACK:
六.注意事項
- 更新
要做任何檔案異動，除了檔案本身更動外，一定要讓manifest有所變化，否則系統只會一直讀取到Cache的資料，通常可以在manifest內加入一個版號宣告，只要有更動，客戶端即會自動更新Cache - 不使用cache
Application Cache與Browser一般的Cache暫存並不相同，並無法透過Browse的F5來清除， 要讓網頁不使用cache，必須透過刪除manifest內CACHE清單來達到 - 刪除manifest檔案
直接刪除Server上的manifest檔案，也會讓Client不使用Cache - 不要使用舊有的防檔案cache機制
通常會在讀取如js檔案會加上一個版號來控制檔案cache
例
使用Application Cache請不要再使用這樣的手法，把Cache的管理都交給manifest處理即可<script scr="xx.js?ver=1.0"></script>
沒有留言:
張貼留言