第9章离线Web应用和Web存储
离线Web应用
1
离线Web应用的实现
2
Web Storage的概述
3
Web Storage应用
4
离线Web应用
1、离线Web应用工作机制
(1)客户端浏览器中输入要访问页面的URL地址,向该地址指向的Web服务器发出请求。
(2)Web服务器根据浏览器送来的请求,将请求的文档和所需资源返回给浏览器。
(3)浏览器解析返回的文档,处理或显示从Web服务器返回的资源文件。如果支持离线Web应用,重点考察manifest缓存文件,该文件由html标记的manifest属性指定。
2、离线Web应用优点
(1)离线浏览。用户可以在离线时继续使用Web应用程序
(2)提高用户Web应用体验。将资源缓存到本地,资源加载速度更快,缩短Web应用的响应时间。
(3)减轻Web服务器的负载。浏览器只需要从Web服务器下载更新过或更改过的资源。
使用应用缓存实现离线Web应用中,需要在HTML文档的<html>标记中包含manifest属性,并在其中指明manifest文件,该文件的扩展名应为建议为”.appcache”或”.manifest”。
manifest文件是一个文本文件,其中包含离线Web应用程序需要加载的文件列表。
离线Web应用
2、离线Web应用优点
(1)离线浏览。用户可以在离线时继续使用Web应用程序
(2)提高用户Web应用体验。将资源缓存到本地,资源加载速度更快,缩短Web应用的响应时间。
(3)减轻Web服务器的负载。浏览器只需要从Web服务器下载更新过或更改过的资源。
使用应用缓存实现离线Web应用中,需要在HTML文档的<html>标记中包含manifest属性,并在其中指明manifest文件,该文件的扩展名应为建议为“.appcache”或“manifest”。
manifest文件是一个文本文件,其中包含离线Web应用程序需要加载的文件列表。
离线Web应用的实现
HTML5离线Web应用的实现一是构造合理的manifest文件,从而实现资源缓存;二是检测在线状态并实现缓存更新。
1、manifest文件
(1)在线和离线Web应用的效果
离线Web应用的实现
manifest文件解析
manifest缓存文件是离线Web应用的关键,该文件清单的内容具体说明如下。
• manifest文件第一行必须是CACHE MANIFEST,文件扩展名建议使用appcache,也可以使用manifest。
• CACHE:指定需要缓存的文件,清单中列出的文件在首次访问Web服务器进下载并缓存。
• NETWORK:指定的文件需要与服务器连接才能获取,不会被缓存。*是文件通配符,代表除了在CACHE中指明的文外件,所有其他文件都不缓存,需要从Web服务器获得。
• FALLBACK:在此选项下列出的文件当页面无法访问时,使用备用的资源文件。
•文件编码必须是utf-8。
实现应用缓存,需要在<html>标记中定义manifest属性,从而在网页中引用manifest文件,例如:
<html manifest="">
离线Web应用的实现
2、更新缓存
(1)用户更新缓存
可以手动清空缓存,然后再在线访问Web服务器,这时页面是会更新的。浏览器会在第一次访问Web应用程序时将manifest文件中指定的文件下载并保存在本地缓存中。
(2)调用Javascript接口更新缓存
HTML5的Application Cache API,除了可以实现离线资源缓存,也可以用其实现本地缓存更新。
离线Web应用的实现
示例9-3是更新缓存的一个典型示例。
第9章 离线web应用和web存储(html5与css3 web前端开发技术 知识) 来自淘豆网m.daumloan.com转载请标明出处.