‍ 个人简介:一个不甘平庸的平凡人
️ 本系列专栏:Node.js从入门到精通
你的一键三连是我更新的最大动力❤️!
欢迎私信博主加入前端交流群


目录

  • 前言
  • 1️⃣ Cookie&Session
    • 为什么不单独使用Cookie?
    • Session是如何与Cookie结合的?
  • 2️⃣ Cookie&Session的缺陷
    • 存储问题
    • CSRF问题
  • 结语

前言

目前绝大多数的系统都少不了登录验证的功能,这主要是为了保存用户的状态,以此来限制用户的各种行为,从而方便有效的控制用户的权限。比如一个用户登陆微博,发布、关注、评论的操作都应是在登录后的用户状态下进行的。

实现登录验证的功能主要有Cookie&SessionJWT两种方式,这一节我们将先对 Cookie&Session的工作原理 做详细的介绍,在之后的文章中会陆续对JWT,以及如何使用Cookie&SessionJWT来完善前几节我们搭建的简易用户管理系统进行讲解。

关注博主,订阅专栏,学习Node不迷路!

1️⃣ Cookie&Session

我们知道,HTTP 是无状态的。也就是说,HTTP 请求方和响应方间无法维护状态,都是一次性的,它不知道前后的请求都发生了什么。但有的场景下,我们需要维护状态。最典型的,一个用户登陆微博,发布、关注、评论,都应是在登录后的用户状态下的。

这个时候就可以引入CookieSession来保存用户的登录状态。

本篇文章主要介绍使用Cookie-Session来做登录验证的工作原理,关于CookieSession的详细介绍可查阅这位大佬的文章:Cookie和Session详解

为什么不单独使用Cookie?

Cookie是存放在浏览器中的,可以在浏览器中打开控制台,选择应用,找到存储中的Cookie进行查看:

当客户端向服务端发送网络请求时浏览器会自动Cookie添加到请求头中,这样服务端就能获取这个Cookie,如下:

知道了这个原理后,我们就可以想到,如果在用户登录系统时:客户端由用户的部分登录信息(比如usernameid等)生成一个Cookie存放到浏览器中,那么在这之后的每一次网络请求都会自动携带上该Cookie

之后让服务端根据请求中是否携带Cookie并且携带的Cookie中是否存在有效的usernameid来判断用户是否已经登录过了,这样一来用户的登录状态不就被保存下来了吗。

回到上面我们提到的微博的例子,按照这种过程来说,当用户登录过后Cookie已经被保存,这时当用户进行发布、关注、评论等需要登录才能使用的操作时我们就能提前判断是否存在Cookie,如果存在并且Cookie中含有该用户的id,那么我们就可以允许该用户的这些操作(这些操作一般都是需要用户的id的,这时就可以从Cookie中进行获取)。相反的,如果Cookie不存在或者Cookie无效,那么就禁止该用户的这些操作。

说到这,你可能会问:既然一个Cookie就能实现我们想要的效果,那为何还要使用Session呢?

这是因为 Cookie很容易被伪造! ,如果我们知道了Cookie中存放的信息是usernameid(就算不知道,也可以在登录后的网络请求的请求体中找到Cookie),那么我们完全可以在不登录的情况下手动向浏览器存储一个伪造的Cookie

说到这,你应该就能明白为什么不能单独使用Cookie了吧。

Session是如何与Cookie结合的?

Session其实是基于Cookie实现的,并且Session存储在服务端的内存或者数据库中。

当用户登录成功时,使用Cookie&Session的登录验证会进行以下操作:

  1. 由服务端生成SessionSessionId

    Session一般是根据用户登录的信息,如用户名、id等进行生成。
    如果把Session比作是一把锁,那么SessionId就相当于是这把锁的钥匙。

  2. 服务端将Session存储到内存或者数据库中;

  3. 服务端将SessionId存放到请求的响应头(response对象)中的Set-Cookie字段中发送给客户端;

  4. 客户端收到Set-Cookie后会自动将Set-Cookie的值(也就是SessionId)存放到Cookie中;

  5. 之后的每次网络请求都会自动带上Cookie,也就是带上这个SessionId

  6. 服务端收到后续请求时获取请求上的Cookie,也就是获取到了SessionId,然后通过SessionId查询并校验服务端存储的Session,若校验成功说明这个SessionId有效则通过此次请求,反之则阻止此次请求。

图示:

2️⃣ Cookie&Session的缺陷

存储问题

为了保存用户的登录状态,我们需要为每一位登录的用户生成并存储Session,这势必就会造成以下问题:

  • 如果Session存放到内存中,那么当服务端重启时,这些内存中的Session都将被清除,那么所有用户的登录状态都将会过期,并且当用户量较大时,过多的内存占用也势必会影响服务端的性能。
  • 如果Session存放到数据库中,虽然能够解决因服务端重启造成用户登录状态过期的问题,但当用户量较大时,对于这个数据库的维护也会变得相对困难。
  • 如果前端页面中调用的接口来自两个服务器(也就是两套数据库),为了实现Session在两个服务器间共享通常会将Session存放到一个单独的数据库中,这样就使得整个项目变得更为复杂也更加难以维护。

CSRF问题

CSRF全称为 Cross-site request forgery 即 跨站请求伪造,使用Cookie进行验证的网站都会面临或大或小的CSRF威胁,我们以一个银行网站的例子来介绍CSRF的攻击原理:

假如一家银行网站A的登录验证采用的是Cookie&Session,并且该网站上用以运行转账操作Api地址为:http://www.grillbankapi.com/?account=AccoutName&amount=1000

api参数:account代表账户名,amount代表转账金额。

那么,一个恶意攻击者可以在另一个网站B上放置如下代码:

<img src="http://www.grillbankapi.com/?account=Ailjx&amount=1000">

注意:img标签的src网站A转账操作的api地址,并且参数account为Ailjx,amount为1000,也就是说这个api地址相当于是账户名为 Ailjx 转账1000 时调用的api

如果有账户名为 Ailjx 的用户刚访问过网站A不久,登录信息尚未过期(网站ACookie存在且有效)。

那么当 Ailjx 访问了这个恶意网站B时,上面的img标签将被加载,浏览器就会自动请求img标签的src路由,也就是请求http://www.grillbankapi.com/?account=Ailjx&amount=1000 (我们将这个请求记为请求Q),并且因为Cookie存放在浏览器中且浏览器发送请求时会自动带上Cookie,所以请求Q上就会自动携带 Ailjx 在网站A上的Cookie凭证,结果就是这个 请求Q将会被通过,那么 Ailjx 就会损失1000资金

这种恶意的网址可以有很多种形式,藏身于网页中的许多地方。 此外,攻击者也不需要控制放置恶意网址的网站。例如他可以将这种地址藏在论坛,博客等任何用户生成内容的网站中。这意味着如果服务端没有合适的防御措施的话,用户即使访问熟悉的可信网站也有受攻击的危险。

透过例子能够看出,攻击者并不能通过CSRF攻击来直接获取用户的账户控制权,也不能直接窃取用户的任何信息。他们能做到的,是欺骗用户浏览器,让其以用户的名义运行操作。

这些就是使用Cookie&Session来做登录验证的问题所在,那么我们如何解决这些问题呢?这就需要引入JWT的概念,使用token来做登录验证,这些我们将在之后的文章中进行讲解。

结语

博主的Node.js从入门到精通专栏正在持续更新中,关注博主订阅专栏学习Node不迷路!

如果你有一些问题与疑惑,欢迎评论区留言,也欢迎私信博主加入我们的前端技术交流群

如果本篇文章对你有所帮助,还请客官一件四连!❤️