Cookie,localStorage,SessionStorage区别与应用场景

最新推荐文章于 2024-08-08 16:18:02 发布
最新推荐文章于 2024-08-08 16:18:02 发布
阅读量1k 收藏 3
点赞数
文章标签： cookie session 缓存
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/rraxx/article/details/114024959
版权

Cookie,localStorage,SessionStorage区别与应用场景

Cookie是什么？

Cookie：存储在用户本地终端上的数据
Cookie直译为中文是小饼干，顾名思义，它的内存非常小，大小限制为4KB左右
每次http请求都会携带很小的Cookie

localStorage

是H5新增的技术
没有时间限制的数据存储，第二天，下一周,下一年，只要你不删除仍然存在

SessionStorage

针对一个session的数据存储，当用户关闭浏览器时，数据会被删除

三者区别

特性CookielocalStoragesessionStorage
数据的生命周期一般由服务器生成，可以自定义失效时间，如果由浏览器生成，则默认为浏览器关闭时失效只要不删除，就会一直存在仅在当前会话下，当你关闭网页或关闭浏览器时都会失效
存储的数据大小一般为4KB至多为5MB至多为5MB
与服务器端的通信每次都会携带在HTTP头中，一般Cookie中的数据不能保存过多，否则会影响性能问题仅在客户端（浏览器）中进行保存，不参与和服务器的通信仅在客户端（浏览器）中进行保存，不参与和服务器的通信
易用性程序员自己封装，原生的Cookie接口并不友好原生的接口可以接受，但是也可以自己封装，自己封装会对Object和Array更可用原生的接口可以接受，但是也可以自己封装，自己封装会对Object和Array更可用
作用域与所有同源窗口均共享与所有同源窗口均共享不在不同的浏览器窗口共享

应用场景

Cookie:

  • 一般用于判断用户是否登录过网站，以便于下次登录时可以自动登录或记住密码，如果我们删除Cookie中的内容，则下次登录的时候需要重新填写相应的所有有关信息
  • 保存上次登录的时间等信息
  • 保存上次浏览过的页面
  • 保存浏览次数

localStorage:

  • 缓存静态文件内容的JS，CSS
  • 缓存不常使用的API接口数据
  • 存储地理位置

SessionStorage:

用于敏感账号的一次性登录，关闭当时页面再次打开页面时需要重新登录

不可爱仙女
关注
cookie、sessionStorage和localStorage的区别和使用
曹进的博客
07-12 3107
cookie、sessionStorage和localStorage的区别和使用
cookie、sessionStorage和localStorage的区别
aliyun3的博客
04-25 1421
一、 概念的理解 webstorage本地存储 1）webstorage是本地存储，存储在客户端，包括localStorage和sessionStorage 2）localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信 3）sessionStorage仅在当前会话下有效，关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端（
浅谈session,cookie,sessionStorage,localStorage的区别及应用场景
John的专栏
01-22 7854
浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie,session等跟服务端进行数据交互。一、cookie和sessioncookie和session都是用来跟踪浏览器用户身份的会话方式。区别：1、保持状态：cookie保存在浏览器端，session保存在服务器端2、使用方式：（1）cookie机制：如果不在浏览器中设置过期时间，cookie被保存在内存中，生命周期随浏...
cookie，localStorage，SessionStorage三者应用场景
weixin_58195668的博客
05-28 819
一、cookie 1. cookie主要用于与服务器交互的存储，比如用户的登录信息，token令牌等。 2. 存储数据大小：限制在4kb左右。 3. 一般由服务器生成，可设置失效时间，一般都是页面关闭，或定时失效。 4. 存储数据类型：字符串类型的键值对。 二、localStorage 1. localStorage本地存储，不进行清理会永久保存。 2. 有三个方法：setItem、getItem和removeItem。localStorage.setItem("key", "value
一篇文章搞懂Cookie, sessionStorage 和 localStorage
最新发布
AQiukai的博客
08-08 1183
本文章是本人在实习过程中遇到的知识点的自我整理和汇总，主要用于自己记录和回顾，如果可以帮到别人也是十分乐意的。这次详细解释了cookie、localStorage、sessionStorage的详细说明和这三者的区别
localStorage与sessionStorage的使用场景
leng0920的博客
11-16 601
localStorage与sessionStorage的使用场景
关于localStorage的实际应用
weixin_30417487的博客
01-30 108
在客户端存储数据 HTML5 提供了两种在客户端存储数据的新方法： localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。 在 HTML...
cookie,sessionStorage,localStorage的区别及应用场景、http状态码含义、使用token登录、无感登录
muzidigbig的博客
08-26 6078
浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie，session等跟服务端进行数据交互。 一、cookie和session cookie和session都是用来跟踪浏览器用户身份的会话方式。 区别： 1.保持状态：cookie保存在浏览器端（俗称：客户端），session保存在服务器端 2.使用方式： （1）cookie机制：如果不在浏览器中设置过期时间，...
jQuery访问浏览器本地存储cookie、localStorage和sessionStorage的基本用法
10-19
SessionStorage的使用方法与LocalStorage几乎一致： ```javascript // 设置 sessionStorage.setItem("mycolor", "456"); sessionStorage.mycolor = '456'; // 获取 var $color = sessionStorage.getItem("mycolor...
sessionStorage 和 localStorage 的使用
热门推荐
webchang的博客
02-19 1万+
sessionStorage 和 localStorage的属性和方法，事件的触发
什么场景下用到localstorage?
weixin_34302798的博客
07-11 640
localstorage使用在菜单栏的时候，将每一个菜单的数据记录下来。 转载于:https://www.cnblogs.com/duanzhange/p/9293924.html
cookie、sessionStorage、localStorage 详解及应用场景
weixin_34195364的博客
07-28 284
cookie、sessionStorage、localStorage 详解及应用场景 Cookie的作用是与服务器进行交互，作为HTTP规范的一部分而存在，而Web Storage仅仅是为了在本地“存储”数据而生 cookie Cookie的作用是与服务器进行交互，作为HTTP规范的一部分而存在 了解cookie 要表示唯一的一个co...
cookie与sessionStorage机制
weixin_30727835的博客
01-29 176
sessionStorage、localStorage和cookie的区别 共同点：都是保存在浏览器端、且同源的区别：1、cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递，而sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属...
session,cookie,sessionStorage,localStorage的区别及应用场景
蓝莓味的鱼
07-17 627
浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie,session等跟服务端进行数据交互。 一、cookie和session cookie和session都是用来跟踪浏览器用户身份的会话方式。 区别： 1、保持状态：cookie保存在浏览器端，session保存在服务器端 2、使用方式： （1）cookie机制：如果不在浏览器中设置过期时间，cookie被保...
【2】LocalStorage 的介绍以及使用场景
Etc.End的博客
06-16 1439
localStorage是web浏览器的一种本地存储技术，即使关闭当前页面甚至关闭浏览器它也会一直存储，除非用户去清理。否则会永远存在。所以它也是前端持久化技术的一种。
WebStorage 的应用—— sessionStorage
xxKarina的博客
07-23 710
WebStorage 的应用—— sessionStorage本文章属xxKarina原创，转载请注明 个人博客地址：https://xxkarina.github.io/ 需求 解决方法 cookie localStorage sessionStorage 代码示例 注意事项 初学者开发网页的时候会往往会遇到这样一种问题 —— 实现不同页面间的传值 很多时候我们需要将一些数据在本
sessionStorage在项目中的应用
dietuo6403的博客
11-27 208
1. 本地存储 Cookie（局限性）：用户可以禁用cookie，最多只能存储4kb，cookie有过期时间的（一般我们设置的时间最长1个月，用户使用杀毒软件也可以清除我们的cookie）LocalStorage：持久化存储到本地，没有过期时间，最大可存储5MB 都是采用的明文存储，我们在控制台（Resource）下可以看到存储的信息，所以本地存储都是不安全的（不要存储重要的信息，如果...
sessionStorage与localStorage的比较与使用场景
太阳晒屁股了的博客
05-07 4694
前言：我们都知道Cookie是进行权限验证的，它是用户第一次请求服务器后由服务端生成返给客户端的。现在有个需求需要保存用户的权限数据下次请求服务器时带服务端(数据有点大超过4kb)，由于传统的Cookie最大保存数据不能超过4kb，于是问题来了，客户端如何保存这个权限数据呢？ 一，HTML5的的WebStorage提供了客户端存储的2中解决方案，分别是sessionStorage与lo...
关于session、cookie、sessionStorage、localStorage的简要理解
a690304的博客
01-18 292
一、cookie和session 首先session和cookie用于浏览器客户端与服务端进行数据交互，通过会话的方式跟踪浏览器用户身份 (1) cookie 1.1) 一般由服务器生成,可以设置失效时间，如果是浏览器生成则默认浏览器关闭后失效 1.2)与服务器端通信，每次请求都放在http请求头中 1.3)数据存储在内存中，数据大小为4KB，保存类型为字符串 (2) session 2...
localStorage,sessionStorage,cookie使用场景和区别
05-14
localStorage、sessionStorage和cookie都是用于在浏览器端存储数据的方式，但是它们的使用场景和区别是不同的。 1. localStorage localStorage 是 HTML5 提供的一种本地存储的方式，它可以将数据存储在客户端的浏览器中，数据不会随着页面的刷新或关闭而丢失，除非主动删除或者浏览器清理缓存。localStorage 常用于存储用户的个人偏好设置、购物车等数据。 2. sessionStorage sessionStorage 也是 HTML5 提供的一种本地存储的方式，与 localStorage 不同的是，sessionStorage 数据只在当前会话中有效，会话结束后数据就会被清除。会话结束指的是浏览器关闭或者标签页关闭。sessionStorage 常用于在一个页面中传递数据。 3. cookie cookie 是一种在客户端存储数据的方式，它可以将数据存储在客户端的浏览器中，数据不会随着页面的刷新或关闭而丢失，除非过期或者主动删除。cookie 常用于存储用户的登录信息、购物车等数据。 区别： 1. 存储大小：localStorage 和 sessionStorage 的存储大小一般为 5MB，cookie 的存储大小为 4KB。 2. 有效期限：localStorage 和 sessionStorage 的有效期限为永久和会话期间，cookie 的有效期限可以设置。 3. 存储位置：localStorage 和 sessionStorage 的数据存储在浏览器的本地内存中，cookie 的数据存储在浏览器的文件系统中。 4. 安全性：localStorage 和 sessionStorage 的数据存储在浏览器的本地内存中，比 cookie 更加安全，cookie 可能会被其他网站攻击者获取。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值