基于html5的离线存储技术

《基于html5的离线存储技术》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、年月十堰职业技术学院学报２０１３４Ａｐｒ．２０１３，第卷第期２６２Ｊｏｕｒｎａｌ　ｏｆ　Ｓｈｉｙａｎ　ＴｅｃｈｎｉｃａｌＩｎｓｔｉｔｕｔｅ　Ｖｏｌ．２６Ｎｏ．２　基于ＨＴＭＬ５的离线存储技术霍冰鹏（晋城职业技术学院信息中心，山西晋城）０４８０２６摘要是的新标准，不仅提升了页面的性能，也有很多的接口，开 　　ＨＴＭＬ５：Ｗ３ＣＷｅｂＡＰＩ发人员使用这些接口，可以很容易地创建更丰富的程序。利用离线存储技术，使ＷｅｂＨＴＭＬ５用存储和存储机制可以开发离线的应用程序ＤＯＭＷｅｂ　ＳＱＬ　ＤａｔａｂａｓｅＷｅｂ。关键词；离线：；；　ＷｅｂＨＴＭＬ５ＤＯＭ

2、　Ｓｔｏｒａｇｅ中图分类号文献标识码文章编号：：：（）　ＴＰ３９３．０９　　Ａ　　１００８－４７３８０２－０１０３－０４２０１３①引言离线存储的实现０　１　随着［１］技术发展迅速，在平）在标签里通过属性引用一 ＨＴＭＬ５ＨＴＭＬ　５（１ｈｔｍｌｍａｎｉｆｅｓｔ台上，视频、音频、图像、动画以及同电脑的交互都被个文件，该文件里声明了浏览器需ｃａｃｈｅ．ｍａｎｉｆｅｓｔ标准化功能越来越丰富，支持图片上传拖缓存的所有资源文件，如下所示。：ＨＴＭＬ拽、支持、支持、支！ＬｏｃａｌｓｔｏｒａｇｅＷｅｂ　ＳＱＬ　Ｄａｔａｂａｓｅ＜ＤＯＣＴＹＰＥ　ｈｔｍｌ＞持文

3、件存储等等。致力于将带入一个更ＡｐｉＷｅｂ＜ｈｔｍｌ　ｌａｎｇ＝＇ｃｎ＇ｍａｎｉｆｅｓｔ＝＇ｃａｃｈｅ．ｍａｎｉｆｅｓｔ＇＞为成熟的应用平台，本文介绍的离线缓 ＨＴＭＬ　５＜ｈｅａｄ＞存应用的功能""［２］Ｗｅｂ＜ｍｅｔａ　ｈｔｔｐ－ｅｑｕｉｖ＝Ｃｏｎｔｅｎｔ－Ｔｙｐｅｃｏｎ－。离线存储的三大核心功能作用""：／；ｔｅｎｔ＝ｔｅｘｔｈｔｍｌｃｈａｒｓｅｔ＝ＵＴＦ－８＞离线资源缓存需要一种方式来指明应用程序离离线缓存示例页面＜ｔｉｔｌｅ＞ｔｉｔｌｅ＞＜／线工作时所需的资源文件。这样，浏览器才能在在！文件引用 ＜－－ＣＳＳ－－＞线状态时，把这些文件

4、缓存到本地。此后，当用户离＜ｈｅａｄ＞／线访问应用程序时，这些资源文件会自动加载，从而！各种标签 ＜ｂｏｄｙ＞＜－－＞＜ｂｏｄｙ－－／让用户正常使用中，通过。ＨＴＭＬ５Ｃａｃｈｅ　ｍａｎｉ－＞文件指明需要缓存的资源，并支持自动和手动！各种脚本文件ｆｅｓｔ－－－－＞＜两种缓存［３］更新方式。／＜ｈｔｍｌ＞在线状态检测：开发者需要知道浏览器是否在）关于的定义（２ｃａｃｈｅ．ｍａｎｉｆｅｓｔ线，这样才能够针对在线或离线的状态，做出对应的 ＣＡＣＨＥ　ＭＡＮＩＦＥＳＴ处理。在中，提供了两种检测当前网络是注释：需要缓存的文件，无论在线与否，均从ＨＴＭＬ５

5、＃否在线的方式缓存里读取。本地数据存储：离线时，需要能够把数据存储到ｃｈｃｈｅｄ．ｊｓ本地，以便在线时同步到服务器上。为了满足不同ｃａｃｈｅｄ．ｃｓｓ的存储需求提供了和注释：不缓存的文件，无论缓存中存在与否，，ＨＴＭＬ５ＤＯＭ　Ｓｔｏｒａｇｅ＃两种存储机制。前者提供［４］［５］Ｗｅｂ　ＳＱＬ　Ｄａｔａｂａｓｅ均重新获取了易用的对存储方式，而后者提供了基ｋｅｙｖａｌｕｅ／：ＮＥＴＷＯＲＫ本的关系数据库存储功能。ｕｎｃａｃｈｅｄ．ｊｓ收稿日期①　　２０１３－０２－２０：作者简介霍冰鹏），男，晋城职业技术学院信息中心助教，硕士，研究方向：进化算法与智

6、能信息处理　　：（。１９８１－——１０３霍冰鹏：基于的离线存储技术ＨＴＭＬ５／／缓存过期，比如页面检查缓存是否过期时，ｕｎｃａｃｈｅｄ．ｃｓｓ＝５注释：获取不到资源时的备选路径，如发现服务器上的文件被删掉了＃ｉｎ－．ｍａｎｉｆｅｓｔ访问失败，则返回页面／／常用，在后面会稍详细介绍ｄｅｘ．ｈｔｍｌ４０４ＡＰＩＦＡＬＬＢＡＣＫｗｉｎｄｏｗ．ａｐｐｌｉｃａｔｉｏｎＣａｃｈｅ．ｕｐｄａｔｅｕｐｄａｔｅ：（）／／方法调用时，页面会主动与服务器通信，检查页面当 ｉｎｄｅｘ．ｈｔｍｌ　４０４．ｈｔｍｌ几个需要关注的细节前的缓存是否为最新的，如不是，则下载更新

7、后的资文件的类型是源ｃａｃｈｅ．ｍａｎｉｆｅｓｔＭＩＭＥｔｅｘｔ／，至于如何让服务器返回（）／／ｃａｃｈｅ－ｍａｎｉｆｅｓｔｗｅｂ．ｍａｎｉ－文件时添加后，更新到最新的应用缓存ｆｅｓｔＣｏｎｔｅｎｔ－Ｔｙｐｅｔｅｘｔｃａｃｈｅ－ｍａｎｉ－：／ｄａｔｅｒｅａｄｙ，不同服务器配置细节不同，此处不展开。ｗｉｎｄｏｗ．ａｐｐｌｉ－除了上面提及的属性、接口外，ｆｅｓｔ写法以还包含了一系列的事件，大部分与上面ｃａｃｈｅ．ｍａｎｉｆｅｓｔＣＡＣＨＥ　ＭＡＮＩＦＥＳＴｃａｔｉｏｎＣａｃｈｅ提到的对应，如开头，文件编码格式必须是ｕｔｆ－８。ｗｉｎｄｏｗ．ａｐｐｌ

8、ｉｃａｔｉｏｎＣａｃｈｅ．ｓｔａｔｕｓ下表引用的文档会被默认包：ｃａｃｈｅ．ｍａｎｉｆｅｓｔｈｔｍｌ含进缓存清单事件名关联属性事件释义。归纳起来，步骤