在 Web 开发中，CSRF（Cross-site request forgery，跨站请求伪造）攻击是一种常见的安全问题。攻击者通过让用户在已登录的状态下访问其制作的恶意链接或网页，来窃取用户信息、执行不良操作等。本文将重点介绍 Express.js 中的 CSRF 攻击及其防范方法。
什么是 CSRF 攻击
CSRF 攻击利用了浏览器对 COOKIE 的自动发送特性来伪造请求，以达到攻击的目的。具体来说，攻击者会构造一个伪造的表单，其中带有攻击者需要执行的操作，然后将表单提交到目标网站。因为浏览器在访问站点时会自动携带 COOKIE 信息，攻击者就可以完成伪造请求。
通常，攻击者利用伪造请求的方式执行以下恶意操作：
- 以用户的身份向服务器发起一些操作，如发帖、删帖、修改个人信息等。
- 利用网站漏洞来窃取用户信息。
Express.js 中的 CSRF 攻击
Express.js 是一个基于 Node.js 平台的 Web 应用程序开发框架。和其他 Web 开发框架一样，Express.js 也存在 CSRF 攻击的风险。当用户在登录状态下访问攻击者构造的网站或点击了攻击者提供的恶意链接之后，攻击者就能以用户的身份向目标服务器发起一些恶意操作。
下面，我们来看一个 Express.js 中的 CSRF 攻击示例。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
---------------------------- --------- ----- ----
------------ ----- ---- -- -
----------
----- ------------------ --------------
------ ------------- --------- ------------- --
------ ------------- ------------- ------------ --
------- -------------------------------
-------
--
---
--------------------- ----- ---- -- -
-- --------
-- ------------------- -
-------------------------------------
-------
-
-- ----
----- - --- ------ - - ---------
------------ --------
------------------ -----------
---
---------------- -- -- -
------------------- -- ------- -- ---- -------
---在这个示例中，我们模拟了一个转账操作。攻击者可以通过构造以下代码来发起 CSRF 攻击：
-- -------------------- ---- ------- ----- ---- - ------------------------------- ----------- - --------------------------------- ----------- - ------- ----- -- - -------------------------------- ------- - --------- ------- - ----- -------- - -------------------- ----- ------ - -------------------------------- ----------- - --------- ----------- - --------- ------------ - ----------- ----- ------ - --------------------------------- ----------- - --------- --------------------- ------------------------- ------------------------- --------------------------- --------------
从上面的代码可以看出，攻击者构造了一个伪造请求，将转账的目标账户设置为攻击者自己的账户，并将转账金额设为足以清空其它用户的余额。当用户访问攻击者构造的网页时，这个伪造请求就会被自动提交，从而实现攻击者的恶意目的。
Express.js 中的 CSRF 防范
为了有效地防范 CSRF 攻击，我们通常使用以下几种方法：
1. 隐藏字段
使用隐藏字段可以有效防止 CSRF 攻击。在表单中添加一个 token 字段，用于存储一个随机的字符串，服务器在收到表单提交后，会通过校验该 token 字段是否合法，来验证该请求是否为合法请求。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
----- ---- - -----------------
---------------------------- --------- ----- ----
----------------
------------ ----- ---- -- -
----- ----- - ----------------
----------
----- ------------------ --------------
------ ------------- ------------ ---------------- --
------ ------------- --------- ------------- --
------ ------------- ------------- ------------ --
------- -------------------------------
-------
---
---
--------------------- ----- ---- -- -
-- -- ----- ----
-- ---------------- --- --------------- -
----------------------------- --------
-------
-
-- --------
-- ------------------- -
-------------------------------------
-------
-
-- ----
----- - --- ------ - - ---------
------------ --------
------------------ -----------
---
---------------- -- -- -
------------------- -- ------- -- ---- -------
---在这个示例中，我们使用了 csurf 中间件来生成一个随机的 token，然后将该 token 添加到表单中。服务器在收到请求时，会通过校验该 token 字段是否合法，来判断该请求是否为合法请求。
2. SameSite 属性
SameSite 属性是一种 Cookie 安全策略，在 Chrome 51 版本之后被支持。该属性可以阻止在跨站请求时，浏览器向目标站点发送 Cookie，从而有效地防止 CSRF 攻击。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
----- ------------ - -------------------------
------------------------ ----------
------------ ----- ---- -- -
------------------ -------- -
--------- ------
--------- -----
------- ----
---
--------------- ---------
---
---------------- -- -- -
------------------- -- ------- -- ---- -------
---在这个示例中，我们在服务器端设置了一个带有 sameSite: 'lax' 属性的 Cookie，该属性告诉浏览器仅当用户在当前站点进行导航或内部操作时，才允许 Cookie 发送。这样就能有效地防止 CSRF 攻击。
3. 随机数
使用随机数是一种简单而有效的 CSRF 防范方法。在每次请求时，服务器会生成一个随机数并将其添加到表单中，然后在收到请求时，服务器会校验该随机数是否与服务器保存的值一致。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
---------------------------- --------- ----- ----
----- -------------------- - -- -- -
------ ------------------------ - ------
--
------------ ----- ---- -- -
----- ------------ - -----------------------
------------------------ - -------------
----------
----- ------------------ --------------
------ ------------- --------- ------------- --
------ ------------- ------------- ------------ --
------ ------------- ------------------- ----------------------- --
------- -------------------------------
-------
---
---
--------------------- ----- ---- -- -
-- --------
-- ------------------- -
-------------------------------------
-------
-
-- ---------
----- ------------ - -------------------------
-- ----------------------- -- --------------------- --- ------------------------ -
----------------------------- ------ ---------
-------
-
-- ----
----- - --- ------ - - ---------
------------ --------
------------------ -----------
---
---------------- -- -- -
------------------- -- ------- -- ---- -------
---在这个示例中，我们在每个表单中添加了一个随机数，并将该值保存在服务器的 session 中。服务器在收到表单提交时，会通过校验随机数是否合法来判断请求是否为合法请求。由于随机数是每次都不同的，攻击者很难伪造这个值，从而实现 CSRF 攻击。
总结
在本文中，我们介绍了 Express.js 中的 CSRF 攻击及其防范方法。在实际开发中，我们应该使用这些方法来增加应用程序的安全性，提高用户信息的安全保护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ec0a7ff6b2d6eab3656679