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
下面的 NETWORK 小节规定文件 "login.asp" 永远不会被缓存,且离线时是不可用的:

NETWORK:
login.asp
可以使用星号来指示所有其他资源/文件都需要因特网连接:

NETWORK:
*
FALLBACK
下面的 FALLBACK 小节规定如果无法建立因特网连接,则用 "offline.html" 替代 /html5/ 目录中的所有文件:

FALLBACK:
/html5/ /404.html
注释:第一个 URI 是资源,第二个是替补。
更新缓存
一旦应用被缓存,它就会保持缓存直到发生下列情况:

用户清空浏览器缓存
manifest 文件被修改(参阅下面的提示)
由程序来更新应用缓存
实例 - 完整的 Manifest 文件
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js

NETWORK:
login.asp

FALLBACK:
/html5/ /404.html
重要的提示:以 "#" 开头的是注释行,但也可满足其他用途。应用的缓存会在其 manifest 文件更改时被更新。如果您编辑了一幅图片,或者修改了一个 JavaScript 函数,这些改变都不会被重新缓存。更新注释行中的日期和版本号是一种使浏览器重新缓存文件的办法。
关于应用程序缓存的注释
请留心缓存的内容。

一旦文件被缓存,则浏览器会继续展示已缓存的版本,即使您修改了服务器上的文件。为了确保浏览器更新缓存,您需要更新 manifest 文件。

注释:浏览器对缓存数据的容量限制可能不太一样(某些浏览器设置的限制是每个站点 5MB)。

HTML 5 应用程序缓存(下)的更多相关文章

  1. HTML 5 应用程序缓存manifest

    什么是应用程序缓存(Application Cache)? HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. 应用程序缓存为应用带来三个优势: 离线浏 ...

  2. HTML5应用程序缓存Application Cache

    什么是Application Cache HTML5引入了应用程序缓存技术,意味着web应用可进行缓存,并在没有网络的情况下使用,通过创建cache manifest文件,可以轻松的创建离线应用. A ...

  3. 应用程序缓存--manifest

    应用程序缓存(Application Cache)为应用带来三个优势: 离线浏览 - 用户可在应用离线时使用它们 速度 - 已缓存资源加载得更快 减少服务器负载 - 浏览器将只从服务器下载更新过或更改 ...

  4. 【HTML5】浅析HTML5应用程序缓存(ApplicationCache)

    一.为什么需要Web应用程序缓存 在移动互联网时代,设备终端位置不再固定,依赖无线信号,网络的可靠性变得降低,比如坐在火车上,过了一个隧道(15分钟),便无法访问网站,这对于web的伤害是很大的    ...

  5. HTML5应用程序缓存Application Cache详解

    什么是Application Cache HTML5引入了应用程序缓存技术,意味着web应用可进行缓存,并在没有网络的情况下使用,通过创建cache manifest文件,可以轻松的创建离线应用. A ...

  6. HTML 5 应用程序缓存

    使用 HTML5,通过创建 cache manifest 文件,可以轻松地创建 web 应用的离线版本. 什么是应用程序缓存(Application Cache)? HTML5 引入了应用程序缓存,这 ...

  7. 【HTML5】Application Cache应用程序缓存

    HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. 应用程序缓存为应用带来三个优势: 离线浏览 - 用户可在应用离线时使用它们 速度 - 已缓存资源加载 ...

  8. 神奇的HTML5离线存储(应用程序缓存)

    声明:本文为原创文章,如需转载,请注明来源并保留原文链接前端小尚,谢谢! 前言 使用 HTML5,通过创建 cache manifest 文件,可以轻松地创建 web 应用的离线版本. HTML5引入 ...

  9. AppCache 离线存储 应用程序缓存 API 及注意事项

    使用ApplicationCache接口实现离线缓存 原文:http://www.mb5u.com/HTML5/html5_96464.html 推荐:html5 application cache遇 ...

随机推荐

  1. RDLC 设置标题每页显示

  2. 尝试自己翻译了FreeCodeCamp的文章,技术方面多认识了几种技术,文章标题:Transparency in Action Free Code Camp is Now Open Source

    这是FreeCodeCamp其中一篇文章,趁着学习英文的时间,翻译这篇文章,其中讲到作者创建FCC过程,本文属于原创,第一次翻译,翻译还有诸多不足之处,请大家包含. 原文地址:https://medi ...

  3. SpringMVC常用配置-Controller中的各种配置(基于Java API和注解)

  4. php定时任务

    ignore_user_abort(); //关掉浏览器,PHP脚本也可以继续执行. set_time_limit(0); // 通过set_time_limit(0)可以让程序无限制的执行下去 代码 ...

  5. JSTL 自定义标签

    编写描述标签的tld文件,把这个文件放到web-inf/目录下,才能在jsp页面上调用自定义的标签 package test.yz; import java.io.IOException; impor ...

  6. 设计模式学习笔记c++版——单例模式

    特别注意单例模式c++实现在main.cpp中引用的时候要去申明下: Singleton * Singleton::m_Instance = NULL; //定义性声明 不然会报错:无法解析的外部符号 ...

  7. C#正则表达式判断输入日期格式是否正确

      /// <summary>        /// 是否为日期型字符串        /// </summary>        /// <param name=&qu ...

  8. mac上启动Java项目失败

    解决办法参考地址:http://bbs.csdn.net/topics/390813742,感谢csdn账号为iwordword的大神

  9. css实现三角效果

    demo     <!DOCTYPE html> <html lang="zh"> <head> <meta charset=utf-8& ...

  10. xml 的读写

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...