cookie、localStorage、sessionStorage、session

关于标题提到的几个名词，相信大家都不会陌生，在做前端的时候是非常常见的。这里再次温习加深一下印象。

cookie、localStorage、sessionStorage都是用作浏览器缓存。

先介绍区别：

1. 存放数据大小

cookie：4kb左右

localStorage、sessionStorage：5mb左右

2. 存放时间

cookie：一般由服务器来生成，服务器可设置数据失效的时间（即有效期），客户端也可生成cookie， 默认是关闭浏览器即清除。

localStorage： 数据永久保存，除非手动清除。

sessionStorage：（顾名思义：session 对话的意思）即仅在当前会话有效，关闭浏览器或当前对话标签页数据即清除。

3. 应用场景

cookie：cookie一般比较小，所以较常用来保存用户的登录信息状态。

一般在登录页面用户登录成功时，后端返回相应的用户独一的token字段，并设置相应的失效时间，前端拿到相应的token字段后，接下来的请求都带上这个相应的token字段，进行相应的用户身份验证。若cookie相应的字段失效，即可跳转到相应的登录页，让用户重新登录，即达到保存用户登录状态的效果。同样的道理，利用这个想法，也可制作用户的默认登录，同样利用相应的token等字段，在用户访问我们的网站首页时，判断相应的token是否失效，若不失效，即表示用户可默认登录，若超过一定的期限失效，用户即可重新登录。

localStorage、sessionStorage：由于这两个可以存放的数据较为大， 因此应用场景其实见仁见智，主要看自己的需求，如博主在项目开发中遇到一个问题，即需记录当前页面由哪个页面跳转过来，当时博主利用了sessionStorage进行相应的记录，跳转到新页面之后，通过判断sessionStorage的字段判断是否由指定的页面跳转过来，即可进行相应的判断。或者说，有一些页面的数据不需频繁更新，不需要一直向后台请求相应的数据，也可存放到localStorage或sessionStorage中，进行相应的缓存记录，达到网站性能优化的结果。

4. 关于session

session在面试过程或者笔试过程中，也常用来与上面几个字段混淆。

session是保存在服务器端的。思想跟cookie有点像，后端也常session来保存用户的登录信息状态。（由于博主以学前端为主，所以这一块感兴趣的同学，可以再查阅相应的资料进行进一步的了解）

emm, 还有，博主一直没放弃自己的公众号，虽然更新频率没有非常大，但是如果写了相应的文章就会进行相应的记录，希望能跟大家一起学习进步，期待您的关注！