在前端应用程序开发中，跨站点请求伪造（CSRF）攻击是很常见的一种攻击方式。攻击者利用用户在访问网站时已经登录的身份，通过伪造请求，向服务器发送恶意代码，从而造成损害。所以，保护应用程序免受 CSRF 攻击是至关重要的。
在 Hapi.js 应用程序中，我们可以采用下列措施来防止 CSRF 攻击：
1. 采用 Hapi.js 的 crumb 插件
Hapi.js 提供了一个 crumb 插件，它可以有效地防止 CSRF 攻击。我们只需要在服务启动时将 crumb 插件注册到 Hapi 应用程序中，然后在所有需要防护的路由和请求中添加该插件即可。该插件的工作原理如下：
- 当浏览器向服务器发送请求时，crumb 插件会在请求头中加入一个 token，该 token 在服务器端生成，与当前用户的 session id 相关联。
- 当服务器接收到请求时，crumb 插件会将请求头中的 token 与用户 session 中的 token 进行比对，如果不一致，则认为该请求是来自于攻击者的伪造请求，并返回 403 状态码。
下面是一个使用 crumb 插件的示例：
-- -------------------- ---- -------
----- ---- - ----------------
----- ----- - -----------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- ------------
----- -----
---
----- -------------------------
--------------
------- ------
----- ----
-------- --------- -- -- -
------ ------ --------
--
-------- -
-------- -
------ -----
--
--
---
----- ---------------
------------------- ------- --- ---------------------
--
-------在上面的示例中，我们首先通过 await server.register([Crumb]); 语句将 crumb 插件注册到 Hapi 应用程序中。然后，在需要防护的路由中通过 plugins.crumb 选项启用该插件即可。
2. 手工实现 CSRF 防护
对于一些小型的应用程序，我们也可以手工实现 CSRF 防护。其基本思路是在每个表单中添加一个隐藏域，该隐藏域的值存放着当前用户的 session id。当用户提交表单时，服务器将从请求中获取该隐藏域的值，并与用户 session 中的 session id 进行比对，以确保请求来自于合法用户。
下面是一个手工实现 CSRF 防护的示例：
HTML：
<form action="/" method="POST">
<input type="hidden" name="_csrf" value="{{csrfToken}}">
<input type="text" name="username" value="">
<input type="password" name="password">
<input type="submit" value="登录">
</form>JavaScript：
-- -------------------- ---- -------
----- ---- - ----------------
----- ---- - ----------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- ------------
----- -----
---
----------------------- -
---- -----
--------- ------
----------- -----
--------- -------------
------------- ------
------------- -----
---
--------------
------- ------
----- ----
-------- --------- -- -- -
----- --------- - ----------
--------------------- - -
----------
--
------ --------------- -
------ --------
----------
---
--
---
--------------
------- -------
----- ----
-------- --------- -- -- -
-- ---------------------- --- -------------------------------- -
------ ------------------- --------------------
-
------ ------ ---------
--
---
----- ---------------
------------------- ------- --- ---------------------
--
-------在上面的示例中，我们首先通过 server.state 方法注册了一个名为 session 的 state，在其中存储了当前用户的 session id。然后，当用户访问登录页面时，我们会在用户的 session 中存储一个随机生成的 uuid，该 uuid 会被存放到表单的隐藏域中。当用户提交表单时，我们根据表单中提交的隐藏域值来获取用户 session 中的 session id，然后与提交的 session id 进行比较，从而判断请求是否来自于合法用户。
总结：
- 保护应用程序免受 CSRF 攻击是一项至关重要的任务。
- 在 Hapi.js 应用程序中，我们可以采用 crumb 插件来防止 CSRF 攻击。
- 对于一些小型的应用程序，我们也可以手工实现 CSRF 防护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64531a18968c7c53b078a4bf