随着互联网的发展，验证码已经成为防止机器人攻击和恶意用户的必要工具之一。其中，图形验证码是最常用的一种。本文将介绍如何在 Fastify 框架中实现图形验证码。
什么是 Fastify？
Fastify 是一种快速和低开销的 Node.js Web 框架。它专注于提供最佳的开发体验和性能，并且易于学习和使用。
实现步骤
1. 安装依赖
首先，我们需要安装依赖。Fastify 框架提供了很多有用的插件，我们使用 fastify-no-icon 和 fastify-csrf 两个插件来处理防跨站点请求伪造（CSRF）攻击和禁用图标请求。
npm install fastify fastify-no-icon fastify-csrf --save
2. 创建路由
接下来，我们需要创建一个路由，该路由将处理生成和发送验证码图像。我们使用 sharp 模块生成图像，svg-captcha 模块生成验证码。这里我们使用 HTTP GET 请求来请求验证码。
-- -------------------- ---- -------
----- ----- - -----------------
----- ---------- - -----------------------
--------------------------- ----- --------- ------ -- -
--- -
----- ------- - --------------------
----- ------ - --------------------------
----- ----- - ----- -------------
--------------- ---- ------- ----
----------------
------------
------------------------------------
- ----- ----- -
--------------------------
-
---3. 添加 CSRF 防护
接下来，我们需要启用防护 CSRF 攻击。Fastify 框架提供了 fastify-csrf 插件来处理。我们可以直接使用它提供的默认设置。
fastify.register(require('fastify-csrf'));
fastify.addHook('preHandler', fastify.csrfProtection);4. 禁用图标请求
最后，我们需要禁用图标请求，因为你不想让浏览器自动请求 /favicon.ico。Fastify 框架提供了 fastify-no-icon 插件来处理。我们可以直接使用它提供的默认设置。
fastify.register(require('fastify-no-icon'));实现示例代码
完整的实现示例代码如下所示：
-- -------------------- ---- -------
----- ------- - --------------------------- -------
----- ----- - -----------------
----- ---------- - -----------------------
------------------------------------------
----------------------------- ------------------------
---------------------------------------------
--------------------------- ----- --------- ------ -- -
--- -
----- ------- - --------------------
----- ------ - --------------------------
----- ----- - ----- -------------
--------------- ---- ------- ----
----------------
------------
------------------------------------
- ----- ----- -
--------------------------
-
---
-------------------- --- -- -
-- ----- -
-----------------------
----------------
-
------------------------ --------- -- -----------------------------------
---总结
本文介绍了如何在 Fastify 框架中实现图形验证码。我们使用了许多有用的 Node.js 模块来生成验证码和图像。我们还学习了如何使用 Fastify 框架的插件来禁用图标请求和防止跨站请求伪造攻击。
这个实现可以作为一个有用的参考，以帮助初学者更好地理解 Fastify 框架和如何实现常用的验证码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647d9b3c968c7c53b0865fb6