基本概念

cookie:是网景公司的前雇员在1993年发明。它的主要用于保存登陆信息,比如登陆某个网站市场可以看到'记住密码’,这就是通过在cookie中存入一段辨别用户身份的数据来实现的。

sessionStorage:会话,是可以将一部分数据在当前会话中保存下来,刷新页面数据依旧存在。但是页面关闭后,sessionStorage中的数据就会被清空。

localStorage:是HTML5标准中新加入的技术,当然早在IE6时代就有一个userData的东西用于本地存储,而当时考虑到浏览器的兼容性,更通用的方案是使用flash。如今localStorage被大多数浏览器所支持。

三者区别

1)存储大小

cookie:一般不超过4K(因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据,如会话标识)

sessionStorage:5M或者更大

localStorage:5M或者更大

2)数据有效期

cookie:一般由服务器生成,可以设置失效时间;若没有设置时间,关闭浏览器cookie失效,若设置了时间,cookie就会存放在硬盘里,过期才失效

sessionStorage:仅在当前浏览器窗口关闭之前有效,关闭页面或者浏览器会被清除

localStorage:永久有效,窗口或者浏览器关闭也会一直保存,除非手动永久清除,因此用作持久数据

3)作用域

cookie:在所有同源窗口中都是共享的

sessionStorage:在同一个浏览器窗口是共享的(不同浏览器、同一个页面也是不共享的)

localStorage:在所有同源窗口中都是共享的

4)通信

ccokie:十种携带在同源的http请求中,即使不需要,故cookie在浏览器和服务器之间来回传递;如果使用cookie保存过多数据会造成性能问题

sessionStorage:仅在客户端(即浏览器)中保存,不参与和服务器的通信;不会自动把数据发送给服务器,仅在本地保存

localStorage:仅在客户端(即浏览器)中保存,不参与和服务器的通信;不会自动把数据发送给服务器,仅在本地保存

5)易用性

cookie:需要自己进行封装,原生的cookie接口不够友好

sessionStorage:原生接口可以接受,可以封装来对Object和Array有更好的支持

localStorage:原生接口可以接受,可以封装来对Object和Array有更好的支持

应用场景

cookie:判断用户是否登录过网站,以便实现下次自动登录或记住密码;保存事件信息等

sessionStorage:敏感账号一次性登录;单页面用的较多(sessionStorage 可以保证打开页面时 sessionStorage 的数据为空)

localStorage:常用于长期登录(判断用户是否已登录),适合长期保存在本地的数据

localstorage sessionstorage和cookie的区别的更多相关文章

  1. 本地存储常用方式 localStorage, sessionStorage,cookie 的区别 和 服务器存储session

    本地存储:把一些信息存储到客户端本地(主要目的有很多,其中有一个就是实现多页面之间的信息共享)       1. 离线缓存(xxx.manifest)  H5处理离线缓存还是存在一些硬伤的,所以真实项 ...

  2. localStorage、sessionStorage和cookie的区别

    本地客户端(浏览器)查看三者信息: HTML4的本地存储:cookie 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等根服务端进行数据交互. 一.co ...

  3. 前端 JS,localStorage/sessionStorage、cookie 及 url 等实现前台数据共享、传输

    需求是这样的:需要统计用户公司某款产品用户的回馈情况,美工给的设计多个psd,每个页面里面都有一个选择题,让用户选择自己的答案,最后经过几次选择之后在最后一个页面统一提交到后台!所以这里引出的技术需求 ...

  4. localStorage sessionStorage 和cookie等前端存储方式总结

    localStorage sessionStorage 和cookie localStorage localStorage是本地存储的,除非清空本地数据 localStorage不会自动把数据发给服务 ...

  5. cookie和localstorage sessionStorage的概念、区别、使用场景

    本文分为三大板块: 1 webStorage的概念 2 cookie/localStorage/sessionStorage的介绍 3 三者之间的共同点和区别 **所有代码引用均来自 作者:OBKor ...

  6. localStorage、sessionStorage、cookie的区别

    localStorage: 存储的内容大概20MB 不同浏览器不能共享,但是在同一浏览器的不同窗口中可以共享 永久生效,它的数据是存储的硬盘上,并不会随着页面或者浏览器的关闭而清楚,需手动清除 ses ...

  7. localStorage. sessionStorage、 Cookie不共同点:(面试题)

    ●存储大小的不同: localStorage的大小一般为5M sessionStorage的大小一般为5M cookies的大小一般为4K ●有效期不同: 1.localStorage的有效期为永久有 ...

  8. localStorage,sessionStorage和cookie的区别

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  9. localStorage、sessionStorage、Cookie的区别及用法

    1.webstorage 本地存储,存储在客户端,包括localStorage和sessionStorage. (1)localStorage:生命周期是永久,这意味着除非用户显示在浏览器提供的UI上 ...

随机推荐

  1. Ubuntu分区小知识与分区方案

    Most PC operating systems still work with an ancient disk partition scheme that historically makes d ...

  2. 51nod 1490: 多重游戏(树上博弈)

    题目链接 该题实质上是一个树上博弈的问题.要定义四种状态——2先手必胜 1先手必败 3可输可赢 0不能控制 叶子结点为先手必败态: 若某结点的所有儿子都是先手必败态,则该结点为先手必胜态: 若某结点的 ...

  3. MySQL/RDS数据如何同步到MaxCompute之实践讲解

    摘要:大数据计算服务(MaxCompute,原名ODPS)是阿里云提供的一种快速.完全托管的EB级数据仓库解决方案.本文章中阿里云MaxCompute公有云技术支持人员刘力夺通过一个实验向大家介绍了阿 ...

  4. php ucwords()函数 语法

    php ucwords()函数 语法 作用:把每个单词的首字符转换为大写 语法:ucwords(string) 参数: 参数 描述 string 必须,规定要转换的字符串 说明:把字符串中每个单词的首 ...

  5. JS中数据结构之字典

    字典是一种以键 - 值对形式存储数据的数据结构 通过数组实现字典 function Dictionary() { this.add = add; this.datastore = new Array( ...

  6. hdu 5564 Clarke and digits

    题目链接 http://acm.hdu.edu.cn/showproblem.php?pid=5564 ------------------------------------------------ ...

  7. 杂项:JFB-权限设置

    ylbtech-杂项:JFB-权限设置 1. 家政经理返回顶部 1. if (UserContext.GetTeamId() == (int)UserType.Manager) { condition ...

  8. MySQL-初始化和自动更新TIMESTAMP和DATETIME

    https://dev.mysql.com/doc/refman/8.0/en/timestamp-initialization.html 例,添加自动更新的保存最后一次修改该条记录的时间戳的字段: ...

  9. 同源策略和跨域资源共享(CROS)

    同源策略 Same-origin policy - Web security | MDN 跨站资源共享 Cross-Origin Resource Sharing (CORS) - HTTP | MD ...

  10. 头疼3-4次的问题,数据从DB导出到EXCEL,再从EXCEL导入到DB,数据格式发生错误 ,导致 程序出错。

    反思: 1 解决 问题的思路 绕远了: 在这个问题出现前,程序是运行正确 的 问题出现前,我误删了DB 的 testcase表的所有 case ,然后 再把邮件 中的excel数据导入到 DB 然后 ...