cookies和localStorage和sessionStorage的区别

首先总的来说,三者都是用于持久化数据存储的手段,都是存储在浏览器端,且同源(协议,端口号,都域名相同)

  • localStorage和sessionStorage都是Web存储,大小5M左右,完全存储在客户端,它们是因为本地存储数据而存在
  • cookies也是存储在浏览器端的,大小不超过4k,作为http规范的一部分,它是通过浏览器的请求将数据传给服务器的。

区别

  • 有效期

1.localStorage ———-永久存储,永不失效,除非手动删除
2.sessionStorage——–数据存储在窗口对象中,窗口关闭后,数据丢失
3. cookies—————–只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭

  • 作用域

1.sessionStorage不在不同的浏览器窗口共享,即使是同一个页面
2.localStorage和cookies是在所有同源窗口中共享的

  • 操作方式
  1. sessionStorage和localeStorage主要通过js操作window.localStorage和window.sessionStorage这两个对象实例的属性和方法
  2. cookies需要前端开发者自己封装setCookies和getCookies
  • 其他区别

1.cookies数据始终在同源的http请求中携带(即使不需要),适合保存很小的数据
2.sessionStorage和localStorage不会自动的将数据发送给服务器,仅在本地存储

  • Storage类的相关成员

1.length 属性 获取存储数据的条数

2.key(n) n:索引值 根据索引值,返回键名

3.getItem(key) key:键名 根据键名,获取数据值

4.setItem(key,value) key:键名 value:键值 根据键名和键值设置数据项,如果键名已经存在,则覆盖值

5.removeItem(key) key:键名 根据键名删除一个数据项

CookieslocalStoragesessionStorage是用于在Web浏览器中存储数据的机制,但它们之间有一些重要的区别。 1. 数据存储方式容量: - Cookies是由浏览器自动管理的小型文本文件,可以存储少量数据(通常不超过4KB)。它们在每个HTTP请求中都会被发送到服务器,并且可以设置过期时间。 - localStoragesessionStorage是HTML5提供的Web Storage API。它们可以存储更大的数据量(通常最大可达5MB),并且只在特定的域名下可用。它们在浏览器中永久保存,除非通过JavaScript代码手动删除。 2. 数据生命周期: - Cookies的生命周期由设置的过期时间决定,可以长时间保存在浏览器中,即使关闭浏览器也不会被删除。 - localStorage的数据在浏览器关闭后仍然存在,因此它们具有持久性。 - sessionStorage的数据仅在当前会话中存在。当浏览器窗口或标签页关闭时,sessionStorage中的数据将被清除。 3. 数据访问权限: - Cookies可以通过设置域名路径来限制访问权限。它们可以在同一个域名下的不同页面之间共享,并且在浏览器服务器之间的每次请求中都会被发送。 - localStoragesessionStorage仅限于在创建它们的网页中访问。它们不会被发送到服务器,因此只能在客户端使用修改。 综上所述,Cookies适合存储需要在客户端服务器之间共享的小型数据。localStorage适合存储需要在浏览器关闭后仍然存在的大量数据。sessionStorage适合存储在单个会话期间需要临时保留的数据。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值