cookie,localStorage和sessionStorage的区别

最新推荐文章于 2023-09-23 10:44:54 发布

byCHENJIAJIE

最新推荐文章于 2023-09-23 10:44:54 发布

阅读量174

点赞数

本文链接：https://blog.csdn.net/m0_37996098/article/details/78478779

版权

cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

当访问者首次访问页面时，他或她也许会填写他/她们的名字。名字会存储于 cookie 中。当访问者再次访问网站时，他们会收到类似 "Welcome Jacob!" 的欢迎词。而名字则是从 cookie 中取回的。这通常就是通过在 cookie 中存入一段辨别用户身份的数据来实现的。

在HTML5之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。

在HTML5中提供了两种在客户端存储数据的新方法：

为每一个给定的源（given origin）维持一个独立的存储区域，该存储区域在页面会话期间可用（即只要浏览器处于打开状态，包括页面重新加载和恢复）。

同样的功能，但是在浏览器关闭，然后重新打开后，除非数据被清除，否则仍然存在。

特性	cookie	sessionStorage	localStorage
数据生命期	生成时就会被指定一个maxAge值，这就是cookie的生存周期，在这个周期内cookie有效，默认关闭浏览器失效	页面会话期间可用	除非数据被清除，否则一直存在
存放数据大小	4K左右（因为每次http请求都会携带cookie）	一般5M或更大详细看这(需科学上网)
与服务器通信	由对服务器的请求来传递，每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题	数据不是由每个服务器请求传递的，而是只有在请求时使用数据，不参与和服务器的通信
易用性	cookie需要自己封装setCookie，getCookie	可以用源生接口，也可再次封装来对Object和Array有更好的支持
共同点	都是保存在浏览器端，和服务器端的session机制不同（这里有一篇很好的介绍cookie和session的文章）

无论是cookie还是HTML5的本地存储，都是相对不安全的，很容易受到各种各样的攻击，特别是HTML5的存储空间大，给了攻击者更大的发挥平台，所以都不能用来存储敏感信息。登录信息等重要信息还是存放到服务器里比较好。

关注