cookie

容量4kb,默认各种浏览器都支持,缺陷就是每次请求,浏览器都会把本机存的cookies发送到服务器,无形中浪费带宽。
userdata,只有ie支持,单个容量64kb,每个域名最多可存10个共计640k数据。默认保存在C:\Documents and Settings\Administrator\UserData\目录下,保存格式为xml。关于userdata更多资料参考 url=/workshop/author/behaviors/reference/behaviors/userdata.asp

sessionStorage与localStorage
Web Storage实际上由两部分组成:sessionStorage与localStorage。
sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。其中sessionStorage的概念很特别,引入了一个“浏览器窗口”的概念。sessionStorage是在同源的同窗口(或tab)中,始终存在的数据。也就是说只要这个浏览器窗口没有关闭,即使刷新页面或进入同源另一页面,数据仍然存在。关闭窗口后,sessionStorage即被销毁。同时“独立”打开的不同窗口,即使是同一页面,sessionStorage对象也是不同的。

共同点:

都是保存在浏览器端,且同源的。

区别:

1.cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。

2.cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。

3.存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。

4.数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。

5.作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。

为什么选择Web Storage而不是Cookie?
与Cookie相比,Web Storage存在不少的优势,概括为以下几点:
1. 存储空间更大:IE8下每个独立的存储空间为10M,其他浏览器实现略有不同,但都比Cookie要大很多。
2. 存储内容不会发送到服务器:当设置了Cookie后,Cookie的内容会随着请求一并发送的服务器,这对于本地存储的数据是一种带宽浪费。而Web Storage中的数据则仅仅是存在本地,不会与服务器发生任何交互。
3. 更多丰富易用的接口:Web Storage提供了一套更为丰富的接口,使得数据操作更为简便。
4. 独立的存储空间:每个域(包括子域)有独立的存储空间,各个存储空间是完全独立的,因此不会造成数据混乱。

兼容性如何?
接下来的各种测试是在以下浏览器中进行的:IE8、Firefox3.6、Chrome5、Safari4、Opera10,事实证明各个浏览器在API方面的实现基本上一致,存在一定的兼容性问题,但不影响正常的使用。

Web Storage带来的好处:

减少网络流量:一旦数据保存在本地后,就可以避免再向服务器请求数据,因此减少不必要的数据请求,减少数据在浏览器和服务器间不必要地来回传递。快速显示数据:性能好,从本地读数据比通过网络从服务器获得数据快得多,本地数据可以即时获得。再加上网页本身也可以有缓存,因此整个页面和数据都在本地的话,可以立即显示。临时存储:很多时候数据只需要在用户浏览一组页面期间使用,关闭窗口后数据就可以丢弃了,这种情况使用sessionStorage非常方便。

浏览器本地存储与服务器端存储之间的区别其实数据既可以在浏览器本地存储,也可以在服务器端存储。

浏览器端可以保存一些数据,需要的时候直接从本地获取,sessionStorage、localStorage和cookie都由浏览器存储在本地的数据。

服务器端也可以保存所有用户的所有数据,但需要的时候浏览器要向服务器请求数据。1.服务器端可以保存用户的持久数据,如数据库和云存储将用户的大量数据保存在服务器端。2.服务器端也可以保存用户的临时会话数据。服务器端的session机制,如jsp的 session 对象,数据保存在服务器上。实现上,服务器和浏览器之间仅需传递session id即可,服务器根据session id找到对应用户的session对象。会话数据仅在一段时间内有效,这个时间就是server端设置的session有效期。

服务器端保存所有的用户的数据,所以服务器端的开销较大,而浏览器端保存则把不同用户需要的数据分布保存在用户各自的浏览器中。浏览器端一般只用来存储小数据,而服务器可以存储大数据或小数据。服务器存储数据安全一些,浏览器只适合存储一般数据。

转载于:https://www.cnblogs.com/christineHu/p/6136911.html

sessionStorage 、localStorage 与cookie 的异同点相关推荐

  1. 关于sessionStorage,localStorage和cookie三者之间相同点与不同点

    关于sessionStorage,localStorage和cookie三者之间相同点与不同点 类别 sesstionStorage localstorage cookie 存储量 5M(具体看浏览器 ...

  2. 浅谈 sessionStorage、localStorage、cookie 的区别以及使用

    1.sessionStorage.localStorage.cookie 之间的区别 相同点 cookie 和 webStorage 都是用来存储客户端的一些信息 不同点 localStorage l ...

  3. sessionStorage localStorage cookie的区别

    sessionStorage localStorage cookie的区别 基本概念 cookie:是网景公司的前雇员在1993年发明.它的主要用于保存登陆信息,比如登陆某个网站市场可以看到'记住密码 ...

  4. sessionStorage 、localStorage 和 cookie 之间的区别(转)

    essionStorage .localStorage 和 cookie 之间的区别(转) 2012-05-08 14:29:19|  分类: HTML5CSS3WEBAPP|举报|字号 订阅 ses ...

  5. sessionStorage localStorage cookie

    sessionStorage & localStorage & cookie 概念 html5中的Web Storage包括了两种存储方式:sessionStorage和localSt ...

  6. javascript中sessionStorage 、localStorage 和 Cookie

    javascript中sessionStorage .localStorage 和 Cookie 欢迎访问我的博客,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~ 参考文章:JS 详解 Cookie. ...

  7. 页面之间跳转传参数不使用cookie和url的方法,sessionStorage,localStorage

    页面之间跳转传参数不使用cookie和url的方法,sessionStorage,localStorage 刚步入工作不久的小白,最近在做一个传感器网站项目的时候是用cookie存取数据,因为网站面向 ...

  8. localStorage和cookie的跨域解决方案

    localStorage和cookie的跨域解决方案 参考文章: (1)localStorage和cookie的跨域解决方案 (2)https://www.cnblogs.com/vsmart/p/9 ...

  9. 前端存储 (2) - sessionStorage ,localStorage

    sessionStorage ,localStorage 存储 目录 定义 生命周期 语法 存储大小 注意点 定义 sessionStorage ,localStorage 浏览器提供的api, 可以 ...

最新文章

  1. python升级知识整理 第五节:文件整理
  2. DDD 领域驱动设计 教程
  3. flutter重新配置sdk路径_在Android中配置flutter
  4. cannot find -lf2c
  5. 建立能持续处理请求的Client端改造
  6. kettle变量(param命名参数)
  7. 计算机考试忘记备注班级了,2012年计算机二级Access第二十五套上机试题及答案详解...
  8. OC基础--block
  9. 打开TestFlight并链接到具体的应用下载界面
  10. 带你快速读懂ITIL4
  11. photoshop cs3 调色教程 让夏天成秋天
  12. 2019蓝桥杯国赛c++B组
  13. 新学习之 jQuery-boxy
  14. 代理服务器为何受欢迎?
  15. 使用node实现简单的增删改查功能的小demo
  16. sql:mysql:数据库优化
  17. vlan是什么?如何划分vlan?如何实现vlan?使用vlan的优点!
  18. 20均线和60均线的关系和看点
  19. Mybatis 和 Mybatis Plus 的区别
  20. 解决IE11不能打开网页问题

热门文章

  1. Ubuntu换源教程
  2. 11 | Gossip协议:流言蜚语
  3. mac使用scp上传下载文件/文件夹
  4. 云开发多功能工具箱微信小程序源码/带流量主微信小程序源码
  5. Groupid和ArtifactId 名词解释和命名规范
  6. java中数组的引用是什么意思_java数组的引用有什么意义
  7. 棋盘覆盖 (详细图解)
  8. 【刷题-Python】管子切割卖出以获得最大利润问题
  9. 测试圈相亲平台开发流程(21):匹配算法(下)
  10. IPVS调度算法之WRR