当前位置: 首页 > Web前端 > HTML5

使用节点生成验证码

时间:2023-04-05 01:17:18 HTML5

前言网络安全一直是一个重要的话题。例如,当您发现有人恶意请求您网站的邮箱注册接口时,那么您可以考虑在服务器端添加验证码,以提高网站的安全性,这篇文章就讲讲如何用node实现一个验证码。前端展示的前端部分如下:注意当用户点击图片时,需要刷新一张新图片,因为浏览器会缓存同一张图片,所以需要对缓存做一些处理这里。这里我使用在图片地址上加上当前时间戳来达到刷新的目的。代码如下:html部分

js部分后端部分首先,npminstallgd-bmp模块:npmigd-bmp--save这是一个高效的100%js应用图形库,支持绘制点、线、曲线、矩形、圆等,地址如下:https://github.com/zengming00...后台代码如下:varhttp=require('http')varBMP24=require('gd-bmp').BMP24//生成随机数functionrand(min,max){returnMath.random()*(max-min+1)+分钟|0//特殊技巧,|0可以强制为整数,向下舍入}//制作验证码图像functionmakeCapcha(){letimg=newBMP24(100,40)//长度100,高度40//背景色img.fillRect(0,0,100,40,0xffffff)//白色//绘制曲线varw=img.w/2varh=img.hvarcolor=rand(0,0xffffff)vary1=rand(-5,5)//Y轴位置调整varw2=rand(10,15)//值越小,频率越高varh3=rand(3,5)//值越小,范围越大varbl=rand(1,5)for(leti=-w;i