本地存储之Web Storage

来源:互联网 发布:关80端口 编辑:程序博客网 时间:2024/05/22 04:28

Web存储即在客户端存储数据。

在没有Web Storage之前,是通过cookie来在客户端存储数据的。但是由于

  • 浏览器能存cookie数比较少。如IE8,Firefox,opera每个域可以保存的50个cookie,Safari/WebKit没有限制。一个cookie最多可以存放4096B左右的数据(见http://www.ietf.org/rfc/rfc2965.txt )。
  • 每次请求时,cookie都会存放在请求头中,传输到服务器端。但如果请求头大小超过了限制,服务器会处理不了。

因此cookie不适合大量数据的存储。相比用Web Storage更适合存储大量数据:

  • 每个域Chrome,Firefox和Opera是5M,IE是10M。 可以用这个来测 http://dev-test.nemikor.com/web-storage/support-test/ 。
  • 请求时不会带web stroge的内容。

Web storage和cookie的区别

1、Web Storage的概念和cookie相似,区别是它是为了更大容量存储设计的。Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外cookie还需要指定作用域,不可以跨域调用。 
2
、除此之外,Web Storage拥有setItem,getItem,removeItem,clear等方法,不像cookie需要前端开发自己封装setCookie,getCookie。 
3
、但是cookie也是不可以或缺的:cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在 ,而Web Storage仅仅是为了在本地存储数据而生。

Web Storage 提供的客户端存储数据的方法

包括localStorage和sessionStorage。他们都只能读写当前域的数据,区别是,localStorage存储的数据不会过期,sessionStorage存储的数据每次关闭浏览器后都会被清空。

ps:

  • 现在很多浏览器都提供了“匿名访问”,“安全模式”,“隐身窗口”等等功能。在这种情况下,浏览器都是会重新建立一个新的localStorage,所以这些模式下的页面是没法访问在正常模式下的页面中的数据。
  • 曾经,Firefox支持globalStorage:能读写所有域的存储数据的localStorage。但globalStorage没有成为标准。Firefox 13.0后被废弃了。更多见 https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage 。

浏览器支持

IE8+,Firefox 28.0+,chrome 33.0+,Safari 7.0+。更多支持的浏览器见 http://caniuse.com/#search=Storage