在前端开发中，防止 CSRF 攻击是一个非常重要的问题。而 trek-csrf 则是一个非常好用的 npm 包，可以帮助我们实现 CSRF 防护。本文将详细介绍如何使用 trek-csrf 包，并给出相关代码示例。
安装
我们可以通过 npm 安装 trek-csrf：
npm install trek-csrf
引用
在我们的代码中引用 trek-csrf：
const csrf = require('trek-csrf');使用
在处理 HTTP 请求时，我们可以使用 trek-csrf 来校验请求是否携带了有效的 CSRF 标识。我们只需要先生成一个 CSRF Token，再在每个页面中渲染一个隐藏域，使得在提交表单时可以将 Token 一起提交，并在服务端进行验证。
生成 Token
可以使用 csrf() 方法生成一个 CSRF Token：
const { secret, token } = csrf();渲染隐藏域
在每个页面中，我们可以使用以下代码来生成隐藏域：
<input type="hidden" name="_csrf" value="<%= token %>" />
验证 Token
在我们的服务端代码中，可以使用 verify() 方法来验证请求是否携带了有效的 CSRF Token：
-- -------------------- ---- -------
----- - ------ - - ---------------------
------------- ----- ----- -- -
----- - --- - - ----
----- ------- - -
----------- ------------------
--
----- ----------- ---------
----- -------
---示例代码
在下面的代码示例中，我们使用 Koa 框架实现了一个简单的接口，用来演示如何使用 trek-csrf。
-- -------------------- ---- -------
----- --- - ---------------
----- - ------- ----- - - ---------------------
----- - ------ - - ---------------------
----- --- - --- ------
------------- ----- ----- -- -
-- -------- --- ---- -
-------- - -
----- ------------- ---------------
------ ------------- ------------ ---------------- --
------ ----------- ----------- --
------- -----------------------------
-------
--
- ---- -- -------- --- -------- -
----- - --- - - ----
----- ------- - -
----------- ------
--
----- ----------- ---------
-------- - ----- --------- ---------------
- ---- -
-------- - ---- --- -------
-
---
---------------- -- -- -
------------------- ------- -- ------------------------
---在浏览器中访问 http://localhost:3000，可以看到一个表单，填入任意值，点击 Submit 按钮后，如果 CSRF 校验通过，则会返回 post submitted successfully!。
通过本文的介绍，我们详细了解了 trek-csrf 的使用方法，并提供了相关的示例代码。希望本文对大家能够有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005581c81e8991b448d545a