常见的浏览器端的存储技术

cookie

会话cookie是一种临时cookie,它记录了用户访问站点时的设置和偏好,当用户退出浏览器时,会话cookie就会被删除。持久cookie的生存时间更长一些,它存储在用户的硬盘上,浏览器退出或计算机重启时他们仍然存在。会话cookie与持久cookie之间的唯一区别就是它们的过期时间。

cookie会随着每次HTTP请求头信息一起发送,无形中增加了网络流量,另外,cookie能存储的数据容量有限,根据浏览器类型不同而不同,IE6大约只能存储2K

localStorage

localStorage即本地存储,可用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除。

特点
  • 同源策略限制。若想在不同页面之间对同一个localStorage进行操作,这些页面必须在同一协议、同一主机名和同一端口下。(IE89存储数据仅基于同一主机名,忽略协议(HTTPHTTPS)和端口号的要求)
  • 只在本地存储。localStorage的数据不会跟随HTTP请求一起发送到服务器,只会在本地生效。
  • 永久保存。保存的数据没有过期时间,直到手动去除。
  • 存储方式。localStorage的存储方式采用keyvalue的方式。value的值必须为字符串类型(传入非字符串,也会在存储时转换为字符串。true值会转换为"true")。
  • 存储上限限制:不同的浏览器存储的上限也不一样,但大多数浏览器把上限限制在5MB以下。
sessionStorage

sessionStorageHTML5新增的一个会话存储对象,用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据。

特点
  • 同源策略限制。若想在不同页面之间对同一个sessionStorage进行操作,这些页面必须在同一协议、同一主机名和同一端口下。(IE 89存储数据仅基于同一主机名,忽略协议(HTTPHTTPS)和端口号的要求)。

  • 单标签页限制。sessionStorage操作限制在单个标签页中,在此标签页进行同源页面访问都可以共享sessionStorage数据。

  • 只在本地存储。seesionStorage的数据不会跟随HTTP请求一起发送到服务器,只会在本地生效,并在关闭标签页后清除数据。(若使用Chrome的恢复标签页功能,seesionStorage的数据也会恢复)。

  • 存储方式。seesionStorage的存储方式采用keyvalue的方式。value的值必须为字符串类型(传入非字符串,也会在存储时转换为字符串。true值会转换为"true")。

  • 存储上限限制:不同的浏览器存储的上限也不一样,但大多数浏览器把上限限制在5MB以下。

Flash ShareObject

这种方式能能解决上面提到的cookie存储的两个弊端,而且能够跨浏览器,应该说是目前最好的本地存储方案。不过,需要在页面中插入一个Flash,当浏览器没有安装Flash控件时就不能用了。所幸的是,没有安装Flash的用户极少。

缺点:需要安装Flash插件。

userData

userData存储通过将数据写入一个UserData存储区(UserData store)来保存数据,userData将数据以XML格式保存在客户端上,UserData存储方式只适用于IE浏览器(window系统+IE)。

UserData存储区保存以后,即使IE浏览器关闭或者刷新了,下一次进入该页面,数据也能够重新载入而不会丢失,也就是数据将一直存在,除非你人为删除或者用脚本设置了该数据的失效期。容量可达到640K,这种方案是很可靠的,不需要安装额外的插件。

缺点:它仅在IE下有效。

Google Gear

Google开发出的一种本地存储技术。支持IE6IE7FireFox2.0FireFox3.0

缺点:需要安装Gear组件。

globalStorage

在浏览器关闭以后,使用globalStorage存储的信息仍能够保留下来,和sessionStorage一样,域中任何一个页面存储的信息都能被所有的页面共享。目前只有FF支持,且只支持当前域下的globalStorage存储。

参考文章

关于Cookie的知识的总结
HTML5 localStorage本地存储
HTML5 sessionStorage会话存储
IE浏览器下的存储方式——UserData

猜你喜欢

转载自blog.csdn.net/weixin_34128839/article/details/87435239
今日推荐