网络编程
位置:首页>> 网络编程>> 网页设计>> HTML5本地存储初探(三)

HTML5本地存储初探(三)

作者:Robin 来源:Time Machine 发布时间:2010-03-07 15:49:00 

标签:HTML5,本地存储,浏览器,webkit

HTML5本地存储初探(二)

完成了数据的本地存储,就要将文件存储也搞定。为了实现文件的本地存储,html5搞了一个叫 manifest 的文件,这个文件就是一个缓存清单,把需要缓存在客户端的文件告诉浏览器。manifest是一个mimetype为 text/cache-manifest 的 纯文本文件。注意,这点很重要。

下面是一个manifest文件的例子:

NETWORK, CACHE, FALLBACK 都是可选的。

manifest文件必须以 CACHE MANIFEST 开头

其后需要下载并缓存的文件使用相对或绝对路径皆可,每个资源一行。

NETWORK段表明一些在线资源所在的域,所有这个域下的资源都不会被缓存,即使客户端处于离线状态,也会尝试去请求基于这些域的资源。

CACHE段还不是很明白

FALLBACK段下面每行都包含两部分内容,用空格分隔。后半部分是当前半部分路径不能访问时的备选路径(很拗),如上图就是,如果demoimages目录不能访问时,尝试访问images目录。

manifest文件介绍就到这里,下面创建我们自己的manifest文件:

我们只需要缓存两个文件即可,nbStyle.css 和 nbScript.js。还有index.html 本身,由于manifest文件会默认缓存引用自己的文件,所以index.html 不能在缓存列表中写出来:

CACHE MANIFEST# version: 2010-01-20 22:30nbStyle.cssnbScript.js

就是这么简单了,我们将他保存为 notebook.manifest 文件,并和其它文件一起放在根目录。

最后一个问题,如果将notebook.manifest的mimetype标识为 text/cache-manifest 类型呢?我知道有两种方法:

1. 在站点根目录建立 .htaccess 文件,在其中声明.manifest 的mimetype ,这个需要修改下服务器的配置文件,我没有尝试成功。

2. php环境在apache目录寻找一个为 “mime.types” 的配置文件,在其最后添加一行:

text/cache-manifest            manifest

然后在index.html文件引用它:

搞定了这些东西,你就可以尝试用webkit访问你的应用,然后离线,再尝试使用它,程序应该也可以照常运行。

至此,html5的离线存储基本介绍完了,下面附上打包的代码,代码本身没有什么难度,只是我写的太烂了:

远程下载:代码下载 

本站下载 jpQfw.offlineNote.zip (4.78 KB)

其实还远没有完,缓存下来的文件如果被更新了怎么办呢?如何通知客户端更新缓存其实也有api,慢慢的再探索吧。非常期待与大家探讨html5相关的问题。

0
投稿

猜你喜欢

  • 1.因为oracle 10g暂时没有与win7兼容的版本,我们可以通过对安装软件中某些文件的修改达到安装的目地。 a)打开“\ORACLE1
  • 先简单说一下MP3的ID3 标记,因为主要是操作这个玩意MP3最开始的时候没有我们今天看到的那样,有歌手、年代,专集等等信息只有一些简单的参
  • 关于浏览器的最离奇的统计结果之一就是Internet Explorer 版本6,7和8共存。截至本文,Internet Explorer各个
  • 搜索引擎是通过分析网页源代码来分析页面文本信息的逻辑性,所以在编写网页代码的时候一定要尽可能使用合适的标签来体现文本表达的层次感,也即是让搜
  • 本文介绍 SQL Server 2000 企业版的新功能 - 索引视图。讲解索引视图并讨论一些提高性能的具体方案。什么是索引视图?许多年来,
  • 在这系列视觉设计的文章间隙插一篇字体单位的文章。前文说了,字体单位应该用em而不用px,原因简单来说就是支持IE6下的字体缩放,在页面中按c
  • 问题作为一个负责几个服务器的数据库管理员,我接到许多电话是关于磁盘空间的。我所做的第一件事是找到可以缩小的数据文件来释放一些磁盘上的空间。我
  • 基本的网站页面设计元素布局比例统计,给大家做个参考,看看您的网站是否和下面的统计一致:标志图案:位置统计结果左上角84%右上角6%上方居中6
  • 假如某个电脑生产商,它的数据库中保存着整机和配件的产品信息。用来保存整机产品信息的表叫做pc;用来保存配件供货信息的表叫做parts。在pc
  • 浏览器经常Cache你的页面,这是一个很麻烦的问题,下面先提出几种方案来解决一般的问题:(把下面的代码加入到asp程序的最开始位置)<
  • 印刷和网络是不一样的。传统的布局排版并不适于网络,因为传统的印刷布局,几乎只想要什么样的平面效果都能很好的达到,但在网络上设计就很困难,尽管
  • 缓存是基于Application实现的CacheState类,建议实例化时用名Cache程序代码<% Class Cache
  • 今天闲逛在网上时,看到一个11px大小的字体,显示却很清晰,赶紧查看站点的CSS,这字体称叫做:PMingLiu。效果相当不错,相比于我们使
  • 有一个查询如下:  代码如下:SELECT c.CustomerId, CompanyName FROM Customers c
  • 优雅的设计经常包含一些特殊的字体,而这些字体并不存在于用户的字体库中,我们并不能奢求每一个访客都是设计师。  :-)虽然CSS3标
  • 将近两个多月没有敲linux命令,手指头不听话了。该再次温习卖油翁的故事了。曾为oracle如何启动多个实例运行纠结过,不服输心理。当时在一
  • 首先安装WSH,NT(SERVER、WORKSTATION)、W2K服务器上需要安装WSH2.0或者更高版本。然后,参照下列代码即可:<
  • 一直以来,ACCESS数据库中的申报数据在分公司与总公司之间传递,用EXCEL或DBASE、TXT甚至ACCESS等格式,我总觉得不太理想。
  • “用户体验(User Experience,简称UX 或 UE)是一种纯主观的在用户使用一个产品(服务)的过程中建立起来的心理感受。因为它是
  • FrontPage 2003在功能上增强了不少,下面我们一起来看看新版本中比较突出的9个新功能。1.自定义浏览器分辨率预览检查 在
手机版 网络编程 asp之家 www.aspxhome.com