html5离线缓存使用

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文件名来更新缓存文件。

转载于:https://www.cnblogs.com/xucheng/p/5672077.html

html5离线缓存使用相关推荐

html开启页面离线缓存,HTML5 离线缓存
离线缓存 applicationCache 第一次加载后将数据缓存,如果没有清除缓存,下一次没有网络也能加载. 使用 1. 使用 manifest 属性,引入 .appcache 文件每个指定了 m ...
html5 客户端数据缓存机制,深入理解HTML5离线缓存机制
TML5提供了一种离线应用缓存机制,使得网页应用可以离线使用,这种机制在移动端浏览器上支持度非常广,所有版本的android和ios浏览器都能很好的支持.我们可以放心的使用该特性来加速移动端页面的访问 ...
使用 jQuery Mobile 与 HTML5 开发 Web App (十七) —— HTML5 离线缓存
本文要介绍的,是 HTML5 离线网络应用程序的特性,离线网络应用程序在 W3C 中的实际名称是 "Offline Web applications" ,也称离线缓存.当用户打开浏 ...
HTML5 离线缓存
离线资源缓存为了能够让用户在离线状态下继续访问 Web 应用,开发者需要提供一个 cache manifest 文件.这个文件中列出了所有需要在离线状态下使用的资源,浏览器会把这些资源缓存到本地 ...
h5 html被缓存,【Web前端问题】html5离线缓存，不能被缓存问题
回调函数删除删除 var a = ['1','20','2','30']; console.log(a.slice('1')); var ps = document.querySelectorAl ...
tomcat html5离线缓存,HTML5离线缓存在tomcat部署可实现图片flash等离线浏览打
tomcat能解析html5的页面吗?为什么我的H5页面放到...为什么我的H5页面放到tomcat里面后,在手机端用服务器地址访问时,页面html5本身不支持hbuilder的扫码功能,native ...
html5 将资源存于客户端,HTML5离线应用与客户端存储的实现
html5几种在客户端存储数据的实例详解 LocalStorage LocalStorage用于持久化的本地存储,存储资料在客户端(client)的浏览器上,除非主动删除数据,否则数据是永远不会过期 ...
如何在ASP.NET中生成HTML5离线Web应用
传统的Web应用程序有一个很大的症结是当用户的网络连接不好时,应用会加载失败,为了解决这一问题,HTML5中引入了Web的离线工作的功能.离线功能使得Web应用程序类似于本机应用程序,当断开网络连接 ...
前端性能优化之“离线缓存manifest”
在本专栏的这一篇文章中,给各位引出了一个"不同寻常的"性能体验优化方式 -- 离线缓存,并介绍了它的简单用法,本文来详细说说! 啥是离线缓存离线缓存又叫"App ...

html5离线缓存使用

html5离线缓存使用相关推荐

最新文章

热门文章