cookie、session，tooken、localstorage区别与联系

发表于 | 更新于: | 分类于 |

cookie和session

由于http的无状态性，为了使某个域名下的所有网页能够共享某些数据，session和cookie出现了。

简而言之:

  1. session 有如用户信息档案表, 里面包含了用户的认证信息和登录状态等信息.
  2. 而 cookie 就是用户通行证

客户端访问服务器的流程如下：

  1. 客户端会发送一个http请求到服务器端
  2. 服务器端接受客户端请求后，建立一个session，并发送一个http响应到客户端，这个响应头，其中就包含Set-Cookie头部。该头部包含了sessionId。
  3. 在客户端发起的第二次请求，假如服务器给了set-Cookie，浏览器会自动在请求头(cookie)中添加sessionId
  4. 服务器接收请求，分解cookie，验证信息，核对成功后返回response给客户端


区别

  1. cookie数据存放在客户的浏览器上，session数据放在服务器上
  2. session会在一定时间内保存在服务器上，当访问增多，会比较占用你服务器的性能，考虑到减轻服务器性能方面，应当使用cookie
  3. 建议将登录信息等重要信息存放为session，其他信息如果需要保留，可以放在cookie中
  4. session中保存的是对象，cookie中保存的是字符串
  5. session不能区分路径，同一个用户在访问一个网站期间，所有的session在任何一个地方都可以访问到，而cookie中如果设置了路径参数，那么同一个网站中不同路径下的cookie互相是访问不到的。
  6. Cookie支持跨域名访问，例如将domain属性设置为“.biaodianfu.com”，则以“.biaodianfu.com”为后缀的一切域名均能够访问该Cookie。跨域名Cookie如今被普遍用在网络中，例如Google、Baidu、Sina等,而Session则不会支持跨域名访问。Session仅在他所在的域名内有效。

token

token 的认证方式类似于临时的证书签名, 并且是一种服务端无状态（服务端并不会保存身份认证相关的数据）的认证方式, 非常适合于 REST API 的场景。
简单来说，一个真正的 token 本身是携带了一些信息的，比如用户 id、过期时间等，这些信息通过签名算法防止伪造，也可以使用加密算法进一步提高安全性，但一般没有人会在 token 里存储密码，所以不加密也无所谓，反正被截获了结果都一样。（一般会用 base64 编个码，方便传输）

token认证流程

与cookie相似
  1. 用户登录，成功后服务器返回Token给客户端。
  2. 客户端收到数据后保存在客户端
  3. 客户端再次访问服务器，将token放入headers中
  4. 服务器端采用filter过滤器校验。校验成功则返回请求数据，校验失败则返回错误码

优势

无需服务器存储！！！
无需服务器存储！！！
无需服务器存储！！！

客户端存储方案 （cookie、localStorage、sessionStorage）

  • localStorage，生命周期是永久，除非主动清除localStorage信息，否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。
  • sessionStorage，仅在当前会话下有效，关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。
  • cookie，可以作为传递的参数，并可通过后端进行控制，local/session Storage 则主要用于在客户端中保存数据，其传输需要借助 cookie 或其它方式完成

三种方案的对比

特性 Cookie localStorage sessionStorage
生命周期 一般由服务器生成，可设置失效时间。如果在浏览器端生成cookie，默认是关闭浏览器后失效 除非被清除，否则永久保存 仅在当前会话下有效，关闭页面或浏览器后被清除
数据大小 4K左右 一般为5MB 一般为5MB
通信方式 每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题 仅在客户端（即浏览器）中保存，不参与和服务器的通信 同 localStorage

复杂数据存储

上面都是对于简单的数据类型的存储，但当要存储的数据是一个对象或是数组的时候，直接存储是不行的。
存储数据前：利用JSON.stringify将对象转换成字符串
获取数据后：利用JSON.parse将字符串转换成对象

参考

彻底弄懂session，cookie，token
Cookie、session和localStorage、以及sessionStorage之间的区别
HTML5 Web 存储（localStorage和sessionStorage）
Vue + Spring Boot 项目实战（十四）：用户认证方案与完善的访问拦截

0%