启动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)：已开启离线应用，但缓存资源都已标记为废弃