这篇文章给大家分享的内容是关于如何使用node生成验证码，有一定的参考价值，有需要的朋友可以参考一下。
前言
网络安全始终是一个重要话题，比如当你发现有人在恶意请求你的网站的邮箱注册接口，那么你可以考虑在服务端加上验证码，提高网站的安全性，本文就谈谈如何用node实现一个验证码。
前端部分
前端显示如下：
注意一点，当用户点击图片的时候，需要刷新新的图片，因为浏览器会对同一个图片进行缓存，所以这里需要处理缓存的情况。我这里采用给图片地址加上当前时间戳来达到刷新的目的。代码如下：
html部分
登录后复制
js部分
new Vue({ el: '#app', data: { authImgUrl: '' }, created () { this.authImgUrl = 'http://localhost:3000/' }, methods: { changeAuthImg () { this.authImgUrl = 'http://localhost:3000/' + '?' + new Date().getTime() } } })
登录后复制
后端部分
首先，npm安装gd-bmp模块：npm i gd-bmp –save
这是一个高效并且100%js应用图形库，支持画点，线，曲线，矩形，圆形等等，地址如下：
https://github.com/zengming00…
后端代码如下：
var http = require('http')var BMP24 = require('gd-bmp').BMP24// 生成随机数function rand (min, max) { return Math.random() * (max - min + 1) + min | 0 // 特殊的技巧，|0可以强制转换为整数，向下舍入}// 制造验证码图片function makeCapcha() { let img = new BMP24(100, 40) // 长100， 高40 // 背景颜色 img.fillRect(0, 0, 100, 40, 0xffffff) // 白色 // 画曲线 var w = img.w / 2 var h = img.h var color = rand(0, 0xffffff) var y1 = rand(-5, 5) // Y轴位置调整 var w2 = rand(10, 15) // 数值越小频率越高 var h3 = rand(3, 5) //数值越小幅度越大 var bl = rand(1, 5) for (let i = -w; i < w; i += 0.1) { var y = Math.floor(h / h3 * Math.sin(i / w2) + h / 2 + y1) var x = Math.floor(i + w) for (let j = 0; j < bl; j++) { img.drawPoint(x, y + j, color) } } // 生成字符 let p = 'ABCDEFGHKMNPQRSTUVWXYZ1234567890' let str = '' for (var i = 0; i < 4; i++) { // 生成4个字符 str += p.charAt(Math.random() * p.length | 0) } console.log(str) var fonts = [BMP24.font12x24, BMP24.font16x32] var x = 15 for (var i = 0; i < str.length; i++) { let f = fonts[Math.random() * fonts.length | 0] y = 8 + rand(-10, 10) img.drawChar(str[i], x, y, f, rand(0, 0xffffff)) x += f.w + rand(2, 8) } return img}// 创建http服务器http.createServer(function (req, res) { if (req.url === '/favicon.ico') { return res.end() } let img = makeCapcha() res.setHeader('Content-Type', 'image/bmp') res.end(img.getFileData())}).listen(3000)console.log('localhost:3000')
登录后复制
函数makeCapcha用于生成验证码，因为图片格式bmp的，所以设置响应头类型为image/bmp，最后，通过res.end(img.getFileData())将生成的图片返回到客户端。
相关推荐：
关于TypeScript在node项目中的实践分析
以上就是如何使用node生成验证码的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2745447.html
