启动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. github 开源项目

    项目地址: https://github.com/Trinea/android-open-project

  2. Android的IPC机制(一)——AIDL的使用

    综述 IPC(interprocess communication)是指进程间通信,也就是在两个进程间进行数据交互.不同的操作系统都有他们自己的一套IPC机制.例如在Linux操作系统中可以通过管道. ...

  3. ipad iphone 开发的应用,加一个启动预览图片

    如果你想在你的ipad,iphone应用启动是不显示黑屏幕,而是用一个图片代替的话,你只需要吧一张名为 Default.png 的图片加到项目里就行了. 很简单吧,新手们记得去这样美化下你的应用吗,很 ...

  4. makefile实例(2)-多个文件实例

    1,源文件依赖关系 defs.h command.h buffer.h main.cpp * util.cpp * kde.cpp * * command.cpp * * display.cpp * ...

  5. DB2因表空间不够产生load表失败

    今天下午恢复表的时候发现出现错误: SQL3520W  Load Consistency Point was successful. SQL3110N  The utility has complet ...

  6. synchronized作用范围及用法

    1.多线程的同步: 1.1.同步机制: 在多线程中,可能有多个线程试图访问一个有限的资源,必须预防这种情况的发生.所以引入了同步机制:在线程使用一个资源时为其加锁,这样其他的线程便不能访问那个资源了, ...

  7. Nginx中的upstream轮询机制介绍

    Nginx中upstream有以下几种方式: 1.轮询(weight=1) 默认选项,当weight不指定时,各服务器weight相同, 每个请求按时间顺序逐一分配到不同的后端服务器,如果后端服务器d ...

  8. int型长度

    Ø  基本数据类型 C语言中只有4中基本数据类型——整型.浮点型.指针和聚合类型(如数组和结构等):所有其他类型都是从这4种基本类型的某种变化或组合派生而来. 一.整型家族 整型家族包括char.sh ...

  9. Flex的基础用法【转】

    //获得屏幕的分辨率 var x:Number=Capabilities.screenResolutionX; var y:Number=Capabilities.screenResolutionY; ...

  10. ubuntu cloud-archive 软件包 无法验证包来源