sessionStorage 和 localStorage 是 HTML5 Web Storage API 提供的,可以方便的在 web 请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必要地来回传递。
sessionStorage、 localStorage 、 cookie 都是在浏览器端存储的数据,其中 sessionStorage 的概念很特别,引入了一个“浏览器窗口”的概念。 sessionStorage 是在同源的同窗口(或 tab )中,始终存在的数据。也就是说只要这个浏览器窗口没有关闭,即使刷新页面或进入同源另一页面,数据仍然存在。关闭窗口后, sessionStorage 即被销毁。同时“独立”打开的不同窗口,即使是同一页面, sessionStorage 对象也是不同的
cookies会发送到服务器端。其余两个不会。
Microsoft 指出 Internet Explorer 8 增加 cookie 限制为每个域名 50 个,但 IE7 似乎也允许每个域名 50 个 cookie 。 Firefox 每个域名 cookie 限制为 50 个。 Opera 每个域名 cookie 限制为 30 个。 Firefox 和 Safari 允许 cookie 多达 4097 个字节,包括名( name )、值( value )和等号。 Opera 许 cookie 多达 4096 个字节,包括:名( name )、值( value )和等号。 Internet Explorer 允许 cookie 多达 4095 个字节,包括:名( name )、值( value )和等号。
区别:
- Cookie
+ 每个域名存储量比较小(各浏览器不同,大致 4K )
+ 所有域名的存储量有限制(各浏览器不同,大致 4K )
+ 有个数限制(各浏览器不同)
+ 会随请求发送到服务器
- LocalStorage
+ 永久存储
+ 单个域名存储量比较大(推荐 5MB ,各浏览器不同)
+ 总体数量无限制
- SessionStorage
+ 只在 Session 内有效
+ 存储量更大(推荐没有限制,但是实际上各浏览器也不同)
学习到了 感谢分享
想应聘产品经理岗位,不过还没有拿的出手的经历和作品,只做过一些产品运营的工作,都比较浅,只是入了个门,觉得心很虚。
cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)。 cookie数据始终在同源的http请求中携带(即使不需要),记会在浏览器和服务器间来回传递。 sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。 存储大小: cookie数据大小不能超过4k。 sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。 有期时间: localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据; sessionStorage 数据在当前浏览器窗口关闭后自动删除。 cookie 设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭
(1)cookies:一小段文本信息,伴随着用户请求和页面在服务器和浏览器之间传递。因HTTP协议是无状态的,对于一个浏览器发出的多次请求,web服务器无法区分是否来自同一个浏览器,此时需要额外的数据用于维持会话
(2)sessionStorage:用于本地存储一个会话中的数据,这些数据只有在同一个会话中的页面才能访问,会话结束数据随之销毁,它并非持久化的本地存储。
(3)localStorage:用于持久化的本地存储,除非主动删除数据,否则数据永远不会过期
(4)cookies与web storage(session|localStorage)区别:
1)cookies大小受限,并且每次请求新页面时cookie都会被发送过去,无形中浪费了带宽;需要前端自己封装setCookie,getCookie;其作用是与服务器进行交互
2)web storage为更大容量存储而设计,拥有setItem,getItem,removeItem,Clear等方法;其作用是本地存储,避免数据在浏览器和服务器间不必要地来回传递
(5)sessionStorage与localStorage区别:
1)sessionStorage只在session内有效,localStorage永久存储
2)localStorage单个域名存储量较大,总体数量无限制;sessionStorage存储量更大
cookie:浏览器端存储数据,内存比较小,并且有条数限制,会被发往服务器端,用于验证用户身份等操作,被http协议携带 sessionStorage:浏览器端存储数据,内存比较大,只存储在本地不发送到服务端,当本浏览器窗口被关闭,就会被删除 LocalStorage:同上,但是浏览器关闭不会被删除