通过创建cache manifest文件,可以轻松的创建web应用的离线版本。(web应用可进行缓存,并可在没有因特网连接时进行访问)
优势:
1.离线浏览–用户可在应用离线时使用它们
2.速度–已缓存资源加载的更快
3.减少服务器负载–浏览器只从服务器下载更新过或者更改过的资源
1.Cache Manifest基础
如果需要用应用程序缓存,在文档<html>
标签中包含manifest属性
<!DCOTYPE HTML>
<html manifest="demo.appcache">
...
</html>
每个指定了manifest的页面在用户对其访问时都会被缓存。如果未指定manifest属性,则页面不会被缓存。
manifest文件的建议文件扩展名是:“.appcache”
2.manifest文件
manifest文件是简单的文本文件,它告知浏览器被缓存的内容(以及不缓存的内容)
manifest文件分为三部分:
cache-manifest:在此标题下列出的文件将在首次下载后进行缓存
network:此标题下列出的文件需要与服务器连接,且不会被缓存
fallback:此标题下列出的文件规定当页面无法访问时的回退页面(比如404页面)
cache manifest
第一行,CACHE MANIFEST是必需的
CACHE MANIFEST
/theme.css
/logo.gif
/main.js
manifest文件列出了三个资源:一个css文件,一个gif图像,以及一个javascript文件。当manifest文件加载后,浏览器会从网站的根目录下载这三个文件,然后,无论用户何时与因特网断开连接,这些资源依然是可用的。
NETWORK
文件“login.php”永远不会被缓存,且离线时是不可以用的。
NETWORK;
login.php
可以用*指示所有其他资源或文件都需要因特网的连接
NETWORK
*
FALLBACK
如果无法建立因特网连接,则用”offline.html”替代/html5/目录中的所有文件
FALLBACK
/html/ /offline.html
第一个URI是资源,第二个是替补。
3.更新缓存
一旦应用被缓存,它就会保持缓存知道发生下列情况:
用户清空浏览器缓存
manifest文件被修改
由程序来更新应用缓存
一个完整的manifest文件
CACHE MANIFEST
# 2012-02-21 v1.0.0 //注释行
/theme.css
/logo.gif
/main.js
NETWORK:
login.php
FALLBACK:
/html/ /offline.html
应用缓存会在其manifest文件更改时被更新。如果编辑了一幅图片,或者修改了一个javascript函数,这些改变都不会被重新缓存。更新注释行中的日期和版本号是一种使浏览器重新缓存文件的办法。