html5离线缓存的方法,html5的离线缓存

一个离线网络应用程序就是一个URL的列表,html,css,js,图片,或者其他类型的资源。

把这些资源，在本地缓存下来，当你尝试在没有网络连接时访问网络应用程序，你的浏览器将自动切换并使用本地代替。

1、服务器端配置

需要在apache配置文件加：AddType text/cache-manifest .manifest，并重启服务器。

2、manifest文件,格式如下

#这一句必须存在，而且必须放在头部

CACHE MANIFEST

#指明要缓存的内容

CACHE

#指定无需缓存的文件

NETWORK

#这个声明，允许你在资源不可用的情况下，将用户重定向到特定文件

FALLBACK

创建res.manifest如下：

CACHE MANIFEST

CACHE:

test.html

test.css

test.js

NETWORK:

test.jpg

FALLBACK:

3、在html标签添加属性manifest

Title

重新联网后，html内容改变，但页面仍没有变化，因为默认优先使用缓存，修改manifest文件，刷新就可以。

html5提供了两种检测是否在线的方式：

navigator.onLine和online/offline事件。

1、navigator.onLine属性表示当前是否在线。

2、开发者还需要在网络状态发生变化时立刻得到通知，所以提供了online/offline事件。

applicationCache属性，事件，方法API，慎用。

原文：http://www.cnblogs.com/jkko123/p/6372231.html