网络存储:更简便更强大的客服端数据存储[译]

导言

随着Javascript的复杂应用和即将推出的的标准和技术，web应用程序变得越来越先进。我们不断依赖这些应用程序，它们中的大部分已成为我们日常生活中的一部分。在Web应用程序开发中，有一个领域一直很匮乏－－客服端存储数据的能力。直到现在还是这样。

网络存储是一个W3c规范，它提供了在客服端存储数据的能力，直到最后一个会话（会话存储）或局部存储。这远比传统的cookie强大，也更容易操作。在这篇文章中，我们将了解它并学会使用它。

当前的问题：cookie不堪其重

在继续深入之前，让我们对当前在客户端存储数据的方式cookie作一个简要的回顾，它存在以下问题：

• 低容量：通常情况下，cookie的最大容量大约为4kb，这对于存储任何类型的复杂数据是远远不够的；
• 在同一个站点，使用cookie很难跟踪两个或多个事务，这一般发生在两个或多个不同的标签打开时；
• 使用诸如跨站点脚本技术，cookie可以被探测，这会导致安全漏洞

其他与cookie相关的不常用的技术包括查询字符串、隐藏表单域、基于Flash的本地共享对象，每一个都涉及到安全、易用性、大小限制等一系列相关问题。所以直至现在，我们一直使用非常糟糕的方式在客户端存储数据。我们需要一个更好的方式来完成这一切，这就是网络存储的用武之地。

网络存储

W3C的网络存储规范设计了一种在客户端存储数据的更好的方法。它有两个不同的存储类型：会话存储和本地存储。

这两种存储方式在每个域中大约能存储5MB的数据，这明显多于Cookie。正如我们将要看到的那样，我们将更深入的了解它们，并明白是什么使得网络存储成为一个最好的存储机制。

会话存储

会话存储只有一个目的：在你的会话中记住所有数据，并在你关闭选项卡（或窗口）时尽快忘掉它。

设置和获取数据

要在会话存储中设置键值对，你只需要写一行这样的代码：

sessionStorage.setItem(yourkey, yourvalue);

在此获取数据，只需要这样做：

var item = sessionStorage.getItem(yourkey);

在会话存储中存储值“This is a sample sentence”，你可以这样写：

sessionStorage.setItem(1, 'This is a sample sentence');

用javascript的alert方法获取那句话，你可以写：

var item = sessionStorage.getItem(1);
alert(item);

另一个setItem()的例子：

sessionStorage.setItem('name', 'john');

你可以用它来获取：

var name = sessionStorage.getItem('name');

删除和清除数据

也有一些从网络存储中删除和清除数据的方法，removeItem()方法用于从列表中删除一个特定项。

var item = sessionStorage.removeItem(yourkey);

记住，你也可以只引用一个数据项的键值，然后从列表中删除它：

var items = sessionStorage.removeItem(1);

clear()方法用来清除列表中的所有项，你可以使用以下方式：

sessionStorage.clear();

您还可以使用length属性来找出存储中键/值对的数量，如：

var no_of_items = sessionStorage.length;

生活不易，码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠