html5 离线缓存使用以及注意事项

1、index.html中加入离线缓存的声明文件 如：
<!DOCTYPE html>
<html manifest="test.appcache">

test.appcache 与 index.html在相同路径下。

2、服务器端加入MIME TYPE声明：
tomcat如下 web.xml中加入
<mime-mapping>
<extension>manifest</extension>
<mime-type>text/cache-manifest</mime-type>
</mime-mapping>

3、编写test.appcache文件
CACHE MANIFEST
# 2016-04-26
#v1.0.9

CACHE:
css/my.css
js/my.js

NETWORK:
*
FALLBACK:
/html5/ /404.html
第一行必须为CACHE MANIFEST
CACHE:配置要缓存的文件不可以使用通配符
NETWORK：配置不缓存的文件，可以使用通配符表示其他文件都不缓存
FALLBACK:规定当页面无法访问时的回退页面

4、可以通过更改test.appcache中的注释如版本号是浏览器更新缓存文件，第二次打开页面时使用新的文件

5、当index.html也被缓存的情况下可以通过更改test.appcache文件名来更新缓存文件。

html5离线缓存使用的更多相关文章

  1. HTML5离线缓存（Application Cache）

    HTML5离线缓存又名Application Cache,是从浏览器的缓存中分出来的一块缓存区,要想在这个缓存中保存数据,可以使用一个描述文件(manifest file),列出要下载和缓存的资源. ...

  2. HTML5 离线缓存管理库

    一.HTML5离线缓存技术 支持离线缓存是HTML5中的一个重点,离线缓存就是让用户即使在断网的情况下依然可以正常的运行应用.传统的本地存储数据的方式有 localstorage,sessionsto ...

  3. HTML5离线缓存问题

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

  4. HTML5 离线缓存Appcache

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

  5. node.js与HTML5离线缓存

    最近正学到HTML5的离线缓存,却看到需要配置服务器.一下子就懵了,毕竟服务器的有关配置一般是很复杂的,而node.js的服务器是自己的代码生成的,这下要怎么配置?在网上搜索了很久,都没用关于node ...

  6. HTML5离线缓存攻击测试

    本实验采用局域网模拟,通过修改本地HOSTS文件来模拟域名以及DNS欺骗.合法网站使用Linux CentOS7的apache服务器搭建,IP为192.168.1.113,HOSTS文件中加入192. ...

  7. HTML5离线缓存

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

  8. Html5离线缓存详细讲解

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

  9. 使用 jQuery Mobile 与 HTML5 开发 Web App —— HTML5 离线缓存

    本文要介绍的,是 HTML5 离线网络应用程序的特性,离线网络应用程序在 W3C 中的实际名称是 "Offline Web applications" ,也称离线缓存.当用户打开浏 ...

随机推荐

  1. 实现一个JDK代理demo

    JDK代理,非常简单地实现了动态代理(首先是实现对应的InvocationHandler:然后,以接口来为被调用目标构建代理对象,代理对象简介运行调用目标,并提供额外逻辑插入) 缺点:它是只能以接口为 ...

  2. 远程调用——hessian使用入门

    Hessian是一个轻量级的remoting onhttp工具,使用简单的方法提供了RMI的功能. 相比WebService,Hessian更简单.快捷.采用的是二进制RPC协议,因为采用的是二进制协 ...

  3. ASP.NET MVC传递Model到视图的多种方式总结

    ASP.NET MVC传递Model到视图的多种方式总结 有多种方式可以将数据传递到视图,如下所示: ViewData ViewBag PartialView TempData ViewModel T ...

  4. 通过xsd schema结构来验证xml是否合法

    import sys import StringIO import lxml from lxml import etree from StringIO import StringIO # Constr ...

  5. Mac+docker+flask

    1.先要保证mac电脑安装docker 安装的话可以通过命令brew install docker 安装成功后启动,docker 然后在终端执行docker version 或者docker info ...

  6. 牛散NO.3：MACD放之四海 假作真时真亦假

    大宗商品日线“异曲同工夺命勾魂枪” 话说有实战意义的技术在任何资本市场里都能产生出神奇的效果.不能说放之四海皆准,但至少起到触类旁通的“牵强”吧.大宗商品特别是在国际市场交易的大宗 商品由于是来自各方 ...

  7. DevStore开发人员服务有奖征文：小谈新浪微博开放平台

    DevStore开发人员服务有奖征文:小谈新浪微博开放平台 笔者接入新浪微博开发平台也有一段时间了,对整个平台的接入也算比較熟悉,新浪提供了统一的API接口,能够让开发人员更方便的使用API来实现自己 ...

  8. 也谈隐藏盘符等windows 的管理员的策略实现

    网上的文章都知道在HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Policies\Explorer 文件夹下有控制隐藏驱动器 ...

  9. Atitit.java相比c#.net的优点 优缺点  v2 q330

    Atitit.java相比c#.net的优点 优缺点  v2 q330 1. 跨平台可在LINUX上,mac跑以外.主要如下: 1 2. IDE ECLIPSE(500m)是绿色的,换机器不用安装,C ...

  10. Atitit. atiJavaExConverter4js  新的特性

    Atitit. atiJavaExConverter4js  新的特性 1.1. V1新特性1 1.2. V2 新特性1 2. Keyword1 3. Catch1 4. Convert n Thro ...