# 17.应用缓存接口
# 1.概念: 使用HTML5, 通过创建 cache manifest 文件,可以轻松地创建 web 应用的离线版本
# 2.优势:
a) 可配置需要缓存的资源
b) 网络无连接应用仍可用
c) 本地读取缓存资源, 提升访问速度, 增强用户体验
d) 减少请求, 缓解服务器负担
# 3.Cache Manifest 基础:
a) 如需启用应用程序缓存, 请在文档的 <html> 标签中包含 manifest 属性
<!DOCTYPE html>
<html manifest="demo.appcache>
...
</html>
1
2
3
4
2
3
4
b) 每个指定了 manifest 的页面在用户对其访问时都会被缓存. 如果未指定 manifest 属性, 则页面不会被缓存 (除非在 manifest 文件中直接指定了该页面)
c) manifest文件的建议的文件扩展名是: ".appcache"
d) 注意, manifest 文件需要配置正确的 MIME-type, 即"text/cache-manifest". 必须在 web服务器上进行配置 (快捷键: inetmgr)
# 4.manifest 文件:
a) 概念: manifest 文件最简单的文本文件, 它告知浏览器被缓存的内容(以及不缓存的内容)
b) manifest 文件可分为三个部分
> CACHE MANIFEST - 开始
> CACHE - 在此标题下列出的文件将在首次下载后进行缓存
> NETWORK - 在此标题下列出的文件需要与服务器的连接, 且不会被缓存
> FALLBACK - 在此标题下列出的文件规定当页面无法访问时的回退页面(比如404页面)
c) CACHE MANIFEST 说明:
CACHE MANIFEST
#上面一句代码必须是当前文档的第一句
#后面写注释
# 需要缓存的文件清单列表
CACHE:
# 下面就是需要缓存的清单列表
images/l1.jpg
images/l2.jpg
# *:代表所有文件
# 配置每一次都需要重新从服务器获取的文件清单列表
NETWORK:
images/l3.jpg
# 配置如果文件无法获取，则使用指定的文件进行替代
FALLBACK:
images/l4.jpg images/xc.jpg
# /:代表所有文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19