《Pro HTML5 Programming》Web Storage[1]

 

HTML5 网络存储API

 

        在这章，我们将会学习到HTML5的具体应用——有些时候也被称作DOM存储，一种能在网络请求的过程中能够更容易的保存数据的API。

 

网络存储API，前身就是可爱的cookie.以一种在程序间传递少量数据数值的古老程序(Programing)技术命名，也叫做magic-cookie——在用户和服务器之间来回不断地传递数值的嵌入式方法。服务器可以记录用户信息并跟踪用户在浏览过程中的数据。Cookie中可以存储用户的ID以便在诸如购物网站之中存储是哪个用户买了这件商品。Cookie的另一种用途便是在本地应用中存储数值，以便那些数值可以在后继的页面载入中也能够被调用。

 

Cookie值还应用于某些不那么和人心意的操作中，比如为了广告之类的信息而跟踪用户访问过的页面的操作。同样的(As such)，用户也强烈要求浏览器提供随时随地消除Cookie的权利和功能。

 

除了Cookie的普遍特性之外，当然也有一些不尽如人意的地方：

 

1.Cookies严格受大小限制。一般来说只有4KB的数据可以被存储在一个cookie里，意味着大型数据比如文档或者邮件神马的就不可能被存进去了。

        2.Cookie总是在服务器和客户端之间来回往复，不仅仅意味着cookie资料对于客户来说是可见的，还意味着当cookie没有加密的时候是有安全隐患的。而且任何以cookie形式保存的数据在每次联网的时候都会占用带宽。现在，cookie精巧的量级有更大的意义。

 

很多情况下，不用引入网络或是远程服务器是可以达到某种特定的效果的。通过使用HTML5，开发者可以将JavaScript对象缓存在页面加载中(page loads)..（？）通过使用SessionStorage 或者 LocalStorage,开发者可以选择让数据或者存储在单独窗口的页面载入，或者存储在浏览器重启的过程中（？）。这些数据不会被传送到网路上，以便之后能

够更快更有效地调用。还有，应用此API可以存储更大的数据集，可以到几兆，以适应了那些超过文件大小限制的文件数据。

 

Web Storage浏览器支持 Chrome3.0之后，Firefox 3.0之后，IE 8.0之后，Opera10.5之后，Safari 4.0之后。 使用Web Storage API Web Storage很容易使用，我们将会从简单的存储和检索做起，进而比较两种存储方式的异同。最后我们将研究API更NB的方面，比如当变量值改变时候的事件提醒。

    检查浏览器支持状况

 

function checksStorageSupport(){ //session Storage if (window.sessionStorage){ alert('This braoser supports sessionStorage'); } else{ alert('This browser does NOT support sessionStorage'); //localStorage } } 

 

很多浏览器并不支持与文件系统直接联系的文件的sessionStorage存储方式。 注：我们已然可以使用的API有很多很多，但是浏览器可能只支持其中的某一部分。然而，因为Web Storage API 体积很小，已经在很多浏览器中能够做到一致的用户体验。考虑到也可能是用户处于安全和以防泄密的考虑从而关闭了那些实际上能够提供Web Storage 功能的网页的此选项。

 

 

 

......

因为Imagine Cup WP7要求做出一个应用程序，在3月7日之前提交一份项目描述。我所在的由四个人组成的 One Thousand 小组现阶段所确立的研究方向是 基于HTML5 Offline Storage 技术的Web应用程序，其所处的系统平台是微软的Windows Phone 7平台，我们这个囧啊，关于此项目的难点神马的我可以单独发一篇博客去讲，咦？发篇博客去讲讲？也许就能得到好心人的帮助了呢~哈哈，想想而已，但确实觉得如果那样做了的话就能把思路捋清楚一点了。会不会泄露了小组机密？问问组长去。

 

        这篇博客是我在看Q群里乐于分享的朋友上传的《Pro HTML5 Programming》的英文版pdf时候做的翻译，由于水平有限，仅仅做参考，主要是我为自己的学习过程做个记录，有谁看见了，觉得翻译的不好也是应该的。

 

我想说的是，学习一门新东西真的很不容易。聪明的还好，自己创造东西让别人学，像我这样比较笨的...就杯具的只能捡前人剩下的。开端而已，继续努力。