H5离线缓存基础系列
1.什么是离线缓存
离线缓存:离线缓存可以将站点的一些文件缓存到本地,它是浏览器自己的一种机制,将需要的文件缓存下来,以便后期即使没有连接网络,被缓存的页面也可以展示。
2.离线缓存的优势
- 在没有网络的时候可以访问到缓存的对应的站点页面,包括html,js,css,img等等文件
- 在有网络的时候,浏览器也会优先使用已离线存储的文件,返回一个200(from cache)头。这跟HTTP的缓存使用策略是不同的
- 资源的缓存可以带来更好的用户体验,当用户使用自己的流量上网时,本地缓存不仅可以提高用户访问速度,而且大大节约用户的使用流量。
3.如何实现离线缓存
在需要缓存的html文件的根节点(html)添加manifest属性,属性值是当前目录下的一个.appcache文件
01.html文件如下
与01.html文件同目录的.appcache文件
4..appcache文件的内容格式
5.在服务器端将.appcache文件的mime类型配置成 text/cache-manifest
下面以phpstudy为例
打开mime.types文件 在后面添加
6.在网页打开01.html