本地存储

FROM:http://www.planabc.net

跨浏览器的本地存储(一):userData behavior

前言

现在最流行的本地存储莫过于 cookie 的应用,但 浏览器对 cookie 有很多限制,最大的限制在于其对cookie 总大小,仅为 4K 左右(包括名(name)、值(value)和等号)。

对于复杂一点的应用和需求,仅有的 4K 大小还是有点相形见绌,其实很多浏览器(IE、Firefox、Safari)本身也提供了自己的本地存储的功能,或许在特定的环境下能满足我们。

一、userData behavior

浏览器支持:IE5.0 或以上

基本语法:

  • XML:<Prefix: CustomTag id=sID style=”behavior:url(‘#default#userData’)” />
  • HTML:<ELEMENT style=”behavior:url(‘#default#userData’)” id=sID>
  • Script:
    object.style.behavior = “url(‘#default#userData’)”
    object.addBehavior (“#default#userData”)

属性:

  • expires —— 设置或者获取 userData behavior 保存数据的失效日期。
  • XMLDocument —— 获取 XML 的引用。

方法:

  • getAttribute() —— 获取指定的属性值。
  • load(object) —— 从 userData 存储区载入存储的对象数据。
  • removeAttribute() —— 移除对象的指定属性。
  • save(object) —— 将对象数据存储到一个 userData 存储区。
  • setAttribute() —— 设置指定的属性值。

备注:

1、从安全方面考虑,一个 userData 存储区只能用于同一目录和对同一协议进行存储。

2、如果使用 userData behavior 不正确可能会对你的应用造成危害,userData 存储区中的数据没有加密因而不安全的。任何可以访问 UserData 保存磁盘的应用都可以访问该数据,所以,推荐不要保存敏感的数据,比如信用卡号,详细:《Security Considerations: DHTML and Default Behaviors》

3、userData behavior 会跨 session 存储信息到存储区,这提供了动态的数据结构和比 cookie(一般 4KB) 更大的容量。userData 存储区的容量依赖于 domain 的安全域。下表显示的是 userData 存储最大容量,对单独文档和整个域名的所有文档都适用,但基于安全域。

Security ZoneDocument Limit (KB)Domain Limit (KB)
Local achine1281024
Intranet51210240
Trusted Sites1281024
Internet1281024
Restricted64640

4、如果设置 userData behavior 到 html、head、title 或者 style 对象上,当 save 和 load 方法被调用时会出错。如果必须设置到 style 中,可以设置内联或者文档头,例如:

<style>
    .storeuserData {behavior:url(#default#userData);}
</style>

5、对于 userData behavior 来说 ID 是可选的,但是如果有,则会改善执行性能。

6、userData 可以将数据以 XML 格式保存在客户端计算机上,一般保存在 C(WIN 系统盘):\Documents and Settings\XXX\UserData\ 文件夹下。

7、userData 数据一直存在,除非人为删除或者用脚本设置该数据的失效日期(expires)。

大部分翻译自:《userData Behavior》

跨浏览器的本地存储(二):DOM:Storage

DOM Storage,是基于 Web Applications 1.0 specification 中介绍的 Structured client-side storage。相比 Cookies 来说,DOM Stroage 空间更大、更安全、更易于使用的。目前它只在基于Moziila的浏览器中可以使用,从 Firefox2 开始。

一、DOM:Storage: sessionStorage

浏览器支持:Firefox 2.0+

基本语法:

  • // 设置 key 值
    sessionStorage.key = value;
  • // 获取 key 值
    value = sessionStorage.key;

备注:

  1. 作为每个 window 对象的属性存在的全局对象,即:可以通过 sessionStorage 或者 window.sessionStorage 来访问它们。
  2. sessionStorage 含有一个在页面会话有效期内(只要页面没有关闭,一个页面会话就始终保持着,且当页面被重新载入或恢复时“复活”,而打开一个新的标签页或新窗口都会初始化新的会话)可用的存储区域。
  3. sessionStorage 持有那些应该保存的临时数据,一旦浏览器突然被刷新时,可恢复。
  4. sessionStorage 暂时还没有实现在浏览器崩溃后存储和恢复数据的功能( bug 339445 )。

更多信息:sessionStorage specification

样例:自动保存文本字段的内容,如果浏览器突然被刷新,就恢复字段内容,这样就不会丢失任何输入了。

// 获得我们要跟踪的那个文本字段
var field = document.getElementById("field");

// 看看我们是否有一个autosave的值
// (这将只会在页面被突然刷新时发生)
if ( sessionStorage.autosave ) {
    // 恢复文本字段中的内容
    field.value = sessionStorage.autosave;
}

// 每秒钟检查一次文本字段的内容
setInterval(function(){
    // 并把结果保存到会话存储对象中
    sessionStorage.autosave = field.value;
}, 1000);

二、DOM:Storage: globalStorage(重点)

浏览器支持:Firefox 2.0+

基本语法:

  • globalStorage['developer.mozilla.org'] —— 在developer.mozilla.org下面所有的子域都可以通过这个存储对象来进行读和写。
  • globalStorage['mozilla.org'] —— 在mozilla.org域名下面的所有网页都可以通过这个存储对象来进行读和写。
  • globalStorage['org'] —— 在.org域名下面的所有网页都可以通过这个存储对象来进行读和写。
  • globalStorage[''] —— 在任何域名下的任何网页都可以通过这个存储对象来进行读和写。

方法属性:

  • setItem(key, value) —— 设置或重置 key 值。
  • getItem(key) —— 获取 key 值。
  • removeItem(key) —— 删除 key 值。

或者:

  • // 设置 key 值
    window.globalStorage["planabc.net"].key = value;
  • // 获取 key 值
    value = window.globalStorage["planabc.net"].key;

备注:

  1. 作为每个 window 对象的属性存在的全局对象,即:可以通过 globalStorage 或者 window.globalStorage 来访问它们。
  2. Storage 空间:整个域名的默认 Storage 大小为 5MB (不过 Storage 区域的大小用户可以自定义),globalStorage['net'] 为 2MB,globalStorage['planabc.net'] 为 3MB,如果超过限制,则会报错。
  3. Firefox 支持 Storage 事件:document.addEventListener(“storage”, eventHandler, false);。
  4. Firefox 目前还没有实现 globalStorage[tld] 和 globalStorage[''] (会抛出一个安全错误),这是由于对于这些名字空间可以进行随意读写的话是有安全漏洞的。
  5. Firefox 2 允许访问比当前文档域名层次高的存储的对象,由于安全的因素 Firefox 3 中不再允许。

更多信息:globalStorage specification

样例:DOM Storage Test

// 跟踪一个用户在你的域名下所访问的所有页面的次数
globalStorage['mozilla.org'].visits =
    parseInt( globalStorage['mozilla.org'].visits || 0 ) + 1;

参考阅读:



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值