实例 - 残缺的 Manifest 文件

　　

　　

1,什么是应用程序缓存（Application Cache）

　　HTML5 引入了应用程序缓存，这意味着 web 利用可进行缓存，并可在没有因特网连贯时进行拜访。

　　离线缓存：

　　　　离线缓存能够将站点的一些文件缓存到本地，它是浏览器本人的一种机制，

　　　　将须要的文件缓存下来，以便前期即便没有连贯网络，被缓存的页面也能够展现。

　　　　即便有网络，优先本地存储的资源

2,应用程序缓存为利用带来三个劣势：

  • 离线浏览 - 用户可在利用离线时应用它们

　　  * 速度 - 已缓存资源加载得更快

　　  * 缩小服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。

　　* 【

　　　　在没有网络的时候能够拜访到缓存的对应的站点页面，包含html，js，css，img等等文件
　　　　在有网络的时候，浏览器也会优先应用已离线存储的文件，返回一个200（from cache）头。这跟HTTP的缓存应用策略是不同的
　　　　资源的缓存能够带来更好的用户体验，当用户应用本人的流量上网时，本地缓存不仅能够进步用户访问速度，而且大大节约用户的应用流量。
　　   】

3，如何实现离线缓存：

a）Cache Manifest 根底

如需启用应用程序缓存，请在文档的<html> 标签中蕴含 manifest 属性：

　　　　* 在须要缓存的html根节点下面增加属性 manifest ，属性值是一个 . appcache 文件；

　　　　Appcache 是一个管制缓存文件

　　　　* 在同目录下创立demo.appcache 文件，幷增加配置项

　 b）Manifest 文件

manifest 文件是简略的文本文件，它告知浏览器被缓存的内容（以及不缓存的内容）。

　　　　　　manifest 文件可分为三个局部：

　　　　　　　　CACHE MANIFEST - 在此题目下列出的文件将在首次下载后进行缓存

　　　　　　　　NETWORK - 在此题目下列出的文件须要与服务器的连贯，且不会被缓存

　　　　　　　　FALLBACK - 在此题目下列出的文件规定当页面无法访问时的回退页面（比方 404 页面）

　　　　　 * CACHE MANIFEST

　　　　　　第一行，CACHE MANIFEST，是必须的：

　　　　　　CACHE MANIFEST

　　　　　　/theme.css

　　　　　　/logo.gif

　　　　　　/main.js

　　　　　　下面manifest 文件列出了三个资源：一个 CSS 文件，一个 GIF 图像，一个 JavaScript 文件

　　　　　　* NETWORK

　　　　　　NETWORK:

　　　　　　login.php

　　　　　　能够应用星号来批示所有其余资源/文件都须要因特网连贯：

　　　　　　NETWORK:

　　　　　　*

　　　　　　* FALLBACK

　　　　　　FALLBACK:

　　　　　　/html/　　 /offline.html

　　　　　　第一个 URI 是资源，第二个是替补。

4，更新缓存：

一旦利用被缓存，它就会放弃缓存直到产生下列状况：

　　　　用户清空浏览器缓存

　　　　manifest 文件被批改

　　　　由程序来更新利用缓存

 5，在服务器端将.appcache文件的mime类型配置成 text/cache-manifest

　　上面以phpstudy为例

　　　关上，mime.types ,在前面增加----

　　　

6，在网页中关上

　　　　

对于应用程序缓存的注意事项

**-------------

提醒：以 "#" 结尾的是正文行，（# 2012-02-21 v1.0.0）但也可满足其余用处。利用的缓存只会在其 manifest 文件扭转时被更新。如果您编辑了一幅图像，或者批改了一个 JavaScript 函数，这些扭转都不会被从新缓存。更新正文行中的日期和版本号是一种使浏览器从新缓存文件的方法。**

浏览器对缓存数据的容量限度可能不太一样（某些浏览器的限度是每个站点 5MB）。