网页离线缓存

来源：互联网发布：引用60分钟数据编辑：程序博客网时间：2024/06/06 00:50

什么是离线缓存

离线缓存，就是将指定的网页文件（例如css、js）保存到本地，当用户没有网络时，依旧可以通过浏览器使用这些文件。

从网站所有者的角度来说，增加离线缓存功能，能够让用户更好的使用网站。

1 配置manifest文件

2 通过JS进行缓存的控制

将需要离线缓存的文件罗列下来，存储于后缀名为manifest的文件当中。在HTML文件中引入manifest文件

基本语法：

代码实例：

缓存的各类属性和事件，均绑定在“applicationCache”上。

applicationCache.status

用于表示当前的缓存状态，取值范围为0~5。

0代表未缓存，通常是这些页面没有运用离线缓存技术，就是这个状态。

1代表空闲，当缓存是最新的时候为1，不需要做什么操作。

2代表检查中，即浏览器在检查manifest文件是否为最新。

3代表下载中，当前有更新，并且正在下载。

4代表更新就绪，代表当前有更新，并且已经下载完毕。等待下次载入页面的时候，进行更新。

5代表缓存过期。即找不到正确的缓存文件时候，会变成5。

update 用于主动更新缓存

updateready 当有新的缓存，并更新完毕之后，会触发此事件

progress 进度事件，当进行缓存的下载时，会不断的触发该事件

progress中的event对象包含：loaded和total。loaded代表当前已经

加载完成的文件，total为总共需要更新的文件数。

checking 正在检查

downloading 正在下载

obsolete 缓存过期

cached 空闲，缓存为最新状态

error 报错

noupdate 检查更新结束，不需要更新

部分事件使用案例代码：

0 0