启动html5的应用缓存
<!DOCTYPE HTML> <html manifest="filename.appcache"> </html>
filename.appcache的例子
CACHE MANIFEST
# 版本标识 v1
# 必选 缓存文件
CACHE:
/webapp/html/resource/test.css
/webapp/html/test.html
# 可选 需要联网
NETWORK:
/webapp/html/HCApproval_Main.html
# * 表示全部都需要
# 可选 失败的重定向
# FALLBACK:
# / webapp/html/help.html
更新缓存
浏览器清除缓存
filename.appcache 文件的任意修改,也会触发缓存更新
JS更新缓存
window.addEventListener('load', function(){ // window.applicationCache.update(); // 手动更新缓存 或者 监听到加载缓存完成事件后 刷新页面
window.applicationCache.addEventListener("updateready", function(e){ console.log(window.applicationCache.status);
setTimeout(function(){
window.location.reload();
}, 3000);
});
});
window.applicationCache 对象属性和事件方法
window.applicationCache.status 的几个值
- UNCACHED (0):未启用离线应用
- IDLE (1):已开启离线应用,但本地缓存的资源是最新的,并且未标记为废弃资源
- CHECKING (2):当前更新缓存的状态为“检查中”
- DOWNLOADING (3):当前更新缓存的状态为“下载资源中”
- UPDATEREADY (4):当前更新缓存的状态为“更新完毕”
- OBSOLETE (5):已开启离线应用,但缓存资源都已标记为废弃