Node.js中验证码的实现与应用

前言

验证码在各大网站中随处可见,它实际的作用就是为了防止机器提交,从而提高安全性。验证码的类型可以分为三类:普通验证码,行为验证码以及短信验证码。普通验证码是比较早出现的,比如一张模糊的图片,里面由数字或者字母组成,通过用户输入的值进行比对。而随着技术的发展,现在更多的则是行为验证码和短信验证码,行为验证码比如拖动一个滑动以拼成一个完整的图片,或者是把一个角度错误的图片旋转成正确的角度等。而短信验证码,则是给本人手机号码以短信的方式发送验证码。在这几种类型的验证码中,行为验证码实现起来的话,相对繁琐,虽然也有许多的第三方库,但也大多是需要付费的,短信验证码也是一样需要付费。所以今天咱们就讲讲普通验证码的实现与应用,虽说普通验证码没有另外两个验证码那么安全,但是对安全性的保障还是能起作用的。

一、验证码的具体流程

首先在实现它之前,我们先来了解验证码的具体操作流程是怎么样的。在这里,可以分为两个步骤:

  • 获取验证码图片
  1. 服务端生成随机的验证码图片并保存图片中的文字内容
  2. 客户端通过img元素的src地址获取验证码图片
  • 进行验证
  1. 服务端判断是否对验证码进行验证
  2. 是则验证客户端传递过来的验证码是否和服务端保存的验证码一致

二、验证码的实现

通过上述,我们知道了验证码的具体操作流程,那么接下来就进行验证码的实现。

这里我们使用 svg-captcha 这个库来实现。

1. 安装

npm install --save svg-captcha

2. 实现

  • 这里使用Koa2实现一个接口,当我们请求该接口时,服务器会返回验证码的内容给我们。
const Koa = require("koa");
const app = new Koa();
const svgCaptcha = require("svg-captcha");
const Router = require("@koa/router"); // 导入路由
const router = new Router(); // 创建路由

router.get("/captcha", (ctx, next) => {
   
    let captcha = svgCaptcha.create(); // 创建验证码
    ctx.state.captcha = captcha.text; // 保存验证码的内容
    ctx.body = captcha.data; // 响应验证码图片数据
    next();
})

app.use(router.routes()); // 使用路由中间件

app.listen(8000);
  • 当我们在浏览器中输入该接口时,则会给我们返回验证码内容
    在这里插入图片描述
  • 还可以对验证码进行一些其他的配置,配置之后,再查看
const Koa = require("koa");
const app = new Koa();
const svgCaptcha = require("svg-captcha");
const Router = require("@koa/router"); // 导入路由
const router = new Router(); // 创建路由

router.get("/captcha", (ctx, next) => {
   
    let captcha = svgCaptcha.create({
   
        size: 5, // 验证码长度
        ignoreChars: 
  • 1
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值