启动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 对象属性和事件方法
  1. oncached:null
  2. onchecking:null
  3. ondownloading:null
  4. onerror:null
  5. onnoupdate:null
  6. onobsolete:null
  7. onprogress:null
  8. onupdateready:null
  9. status:1
window.applicationCache.status 的几个值
  • UNCACHED (0):未启用离线应用
  • IDLE (1):已开启离线应用,但本地缓存的资源是最新的,并且未标记为废弃资源
  • CHECKING (2):当前更新缓存的状态为“检查中”
  • DOWNLOADING (3):当前更新缓存的状态为“下载资源中”
  • UPDATEREADY (4):当前更新缓存的状态为“更新完毕”
  • OBSOLETE (5):已开启离线应用,但缓存资源都已标记为废弃

html5 的缓存应用 manifest="filename.appcache"的更多相关文章

  1. HTML5离线缓存Manifest

    web app不比PC,有性能和流量方面的考虑,离线应用越来越重要,虽然浏览器有缓存机制,但是时常不靠谱,更何况普通情况下html文件是没法缓存的,断网之后一切over. 什么是manifest? 简 ...

  2. HTML5 离线缓存Appcache

    创建一个和html同名的manifest文件,比如页面为index.html,那么可以建一个index.manifest的文件,然后给index.html的html标签添加如下属性即可: <ht ...

  3. HTML5 缓存: cache manifest

    ---恢复内容开始--- 1:MIME TYPE:text/cache-manifest 服务器配置MIME类型2:需要由你创建的:NAME.manifest 创建manifest文件3:给 < ...

  4. HTML5离线缓存问题

    HTML5离线缓存问题 1.应用程序缓存 什么是应用程序缓存(Application Cache)? HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. ...

  5. HTML5离线缓存

    参考文档:http://www.w3cschool.cc/html/html5-app-cache.html HTML5 应用程序缓存 又称离线缓存 ,即使断线了,刷新后也还是缓存了原来的页面,不会4 ...

  6. H5离线缓存机制-manifest

    简介:Manifest 其实就是web应用的一种缓存机制,主要用于现在webapp应用中,它是浏览器自己的一种机制,随着移动互联网时代的到来,网络可靠性降低,如果我们已经将需要的文件缓存下下来,一旦网 ...

  7. HTML5 离线缓存详解(转)

    离线缓存是html5新特性之一,简单理解就是第一次加载后将数据缓存,在没有清除缓存前提下,下一次没有网络也可以加载,用在静态数据的网页或游戏比较好用.当然,Html5新的特性都不是所有浏览器都能支持的 ...

  8. HTML5 Web缓存&运用程序缓存&cookie,session

    在介绍HTML5 web缓存前,来认识一下cookie和session: session: 由于HTTP是无状态的,你是谁?你干了什么?抱歉服务器都是不知道的. 因此session(会话)出现了,它会 ...

  9. html5离线缓存使用

    html5 离线缓存使用以及注意事项 1.index.html中加入离线缓存的声明文件 如:<!DOCTYPE html><html manifest="test.appc ...

随机推荐

  1. JS面向对象组件(四) -- 面向对象的继承

    什么是继承 •在原有对象的基础上,略作修改,得到一个新的对象 •不影响原有对象的功能 //父类 createPerson function createPerson(name,sex){ this.n ...

  2. JBPM4入门——9.自动节点单线执行

    JBPM入门系列文章: JBPM4入门——1.jbpm简要介绍 JBPM4入门——2.在eclipse中安装绘制jbpm流程图的插件 JBPM4入门——3.JBPM4开发环境的搭建 JBPM4入门—— ...

  3. JBPM4入门——8.等待节点的分支执行

    JBPM入门系列文章: JBPM4入门——1.jbpm简要介绍 JBPM4入门——2.在eclipse中安装绘制jbpm流程图的插件 JBPM4入门——3.JBPM4开发环境的搭建 JBPM4入门—— ...

  4. 编译及load mydqli.so文件

    (1)cd /usr/local/php-5.2.17/ext/mysqli(2)输入/usr/local/php/bin/phpize 回车(3)./configure --prefix=/usr/ ...

  5. IPC_共享内存

    在IPC(InterProcess Communication)的通信模式下,不管是使用消息队列还是共享内存,甚至是信号量,每个IPC的对象(object)都有唯一的名字,称为“键”(key).通过“ ...

  6. Golang几个常用记录日志对比

    go语言有一个标准库,log,提供了最基本的日志功能,但是没有什么高级的功能,如果需要高级的特性,就需要使用第三方包,下面是一些候选的包: go_tmlog https://code.google.c ...

  7. 转--优化临时表使用,SQL语句性能提升100倍

    转自:http://www.51testing.com/html/01/n-867201-2.html [问题现象] 线上mysql数据库爆出一个慢查询,DBA观察发现,查询时服务器IO飙升,IO占用 ...

  8. Linux 文件的几种类型

    文件的几种类型:    1.普通文件   普通文件就是一般意义上的文件,它们作为数据存储在系统磁盘中,可以随机访问文件的内容.Linux系统中的文件是面向字节的,文 件的内容以字节为单位进行存储与访问 ...

  9. 小数点输出精度控制问题 .xml

    pre{ line-height:1; color:#9f1d66; background-color:#d2d2d2; font-size:16px;}.sysFunc{color:#5d57ff; ...

  10. 【Java多线程】两种基本实现框架

    Java多线程学习1——两种基本实现框架 一.前言 当一个Java程序启动的时候,一个线程就立刻启动,改程序通常也被我们称作程序的主线程.其他所有的子线程都是由主线程产生的.主线程是程序开始就执行的, ...