Node.JS用纯JavaScript生成图片或滑块式验证码功能


Posted in Javascript onSeptember 12, 2019

有一些Node.JS图片生成类库,比如node-captcha等的类库,需要c/c++程序生成图片。跨平台部署不是很方便。这里介绍几个用纯JS实现的图片验证码生成模块。

captchapng

用纯JavaScript实现的验证码生成模块。

https://github.com/GeorgeChan/captchapng

安装简单,依赖少:

npm install captchapng

示例:

var captchapng = require('captchapng');
app.get('/sign/captcha.png', function(req, res) {
var captchaNumber  = parseInt(Math.random() * 9000 + 1000)
req.session.captcha = captchaNumber
var p = new captchapng(80,20, captchaNumber); // width,height,numeric captcha
p.color(0, 0, 0, 0); // First color: background (red, green, blue, alpha)
p.color(80, 80, 80, 255); // Second color: paint (red, green, blue, alpha)
var img = p.getBase64();
var imgbase64 = new Buffer(img,'base64');
res.writeHead(200, {
'Content-Type': 'image/png'
});
res.end(imgbase64);
})

Express + Captcha

为Express框架设计的验证码生成模块。

https://github.com/napa3um/node-captcha

安装&示例:

$ npm install captcha
Usage (for Express 4)
'use strict'
const express = require('express')
const session = require('express-session')
const bodyParser = require('body-parser')
const captchaUrl = '/captcha.jpg'
const captchaId = 'captcha'
const captchaFieldName = 'captcha'
const captcha = require('./captcha').create({ cookie: captchaId })
const app = express()
app.use(session({
secret: 'keyboard cat',
resave: false,
saveUninitialized: true,
}))
app.use(bodyParser.urlencoded({ extended: false }))
app.get(captchaUrl, captcha.image())
app.get('/', (req, res) => {
res.type('html')
res.end(`
<img src="${ captchaUrl }"/>
<form action="/login" method="post">
<input type="text" name="${ captchaFieldName }"/>
<input type="submit"/>
</form>
`)
})
app.post('/login', (req, res) => {
res.type('html')
res.end(`
<p>CAPTCHA VALID: ${ captcha.check(req, req.body[captchaFieldName]) }</p>
`)
})
app.listen(8080, () => {
console.log('server started')
})

前端滑块验证

前端生成轨迹发送到后端验证,输入简单,但是容易被破解。

Node.JS用纯JavaScript生成图片或滑块式验证码功能 

https://gitee.com/LongbowEnterprise/SliderCaptcha

总结

以上所述是小编给大家介绍的Node.JS用纯JavaScript生成图片或滑块式验证码功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
JavaScript获取路径设计源码
May 22 Javascript
js监听鼠标事件控制textarea输入字符串的个数
Sep 29 Javascript
JavaScript实现的一个计算数字步数的算法分享
Dec 06 Javascript
javascript中数组的定义及使用实例
Jan 21 Javascript
利用Javascript裁剪图片并存储的简单实现
Mar 13 Javascript
js轮播图透明度切换(带上下页和底部圆点切换)
Apr 27 Javascript
React-Native做一个文本输入框组件的实现代码
Aug 10 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
Oct 11 Javascript
详解 vue better-scroll滚动插件排坑
Feb 08 Javascript
vue实现在表格里,取每行的id的方法
Mar 09 Javascript
解决v-for中使用v-if或者v-bind:class失效的问题
Sep 25 Javascript
优化Vue项目编译文件大小的方法步骤
May 27 Javascript
layui 对table中的数据进行转义的实例
Sep 12 #Javascript
layui点击数据表格添加或删除一行的例子
Sep 12 #Javascript
小程序如何支持使用 async/await详解
Sep 12 #Javascript
layui清空,重置表单数据的实例
Sep 12 #Javascript
layui table 多行删除(id获取)的方法
Sep 12 #Javascript
详解Vue中CSS样式穿透问题
Sep 12 #Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 #Javascript
You might like
修改了一个很不错的php验证码(支持中文)
2007/02/14 PHP
php中关于普通表单多文件上传的处理方法
2011/03/25 PHP
PHP5.4中json_encode中文转码的变化小结
2013/01/30 PHP
php求两个目录的相对路径示例(php获取相对路径)
2014/03/27 PHP
PHP_SELF,SCRIPT_NAME,REQUEST_URI区别
2014/12/24 PHP
微信API接口大全
2015/04/15 PHP
[原创]php简单隔行变色功能实现代码
2016/07/09 PHP
Maps Javascript
2007/01/22 Javascript
JavaScript 字符串与数组转换函数[不用split与join]
2009/12/13 Javascript
firebug的一个有趣现象介绍
2011/11/30 Javascript
ajax页面无刷新 IE下遭遇Ajax缓存导致数据不更新的问题
2012/12/11 Javascript
js文件Cookie存取值示例代码
2014/02/20 Javascript
jquery获取颜色在ie和ff下的区别示例介绍
2014/03/28 Javascript
IE中getElementsByName()对有些元素无效的解决方案
2014/09/28 Javascript
详解Javascript中的原型OOP
2016/10/12 Javascript
详解JS中定时器setInterval和setTImeout的this指向问题
2017/01/06 Javascript
Jquery实现跨域异步上传文件总结
2017/02/03 Javascript
移动端使用localResizeIMG4压缩图片
2017/04/22 Javascript
js使用原型对象(prototype)需要注意的地方
2017/08/28 Javascript
js中的闭包实例展示
2018/11/01 Javascript
jQuery中DOM常见操作实例小结
2019/08/01 jQuery
js实现拾色器插件(ColorPicker)
2020/05/21 Javascript
[00:30]塑造者的传承礼包-戴泽“暗影之焰”套装展示视频
2014/04/04 DOTA
Python中操作符重载用法分析
2016/04/29 Python
django迁移数据库错误问题解决
2019/07/29 Python
使用Python将Exception异常错误堆栈信息写入日志文件
2020/04/08 Python
浅谈Python3多线程之间的执行顺序问题
2020/05/02 Python
python如何写个俄罗斯方块
2020/11/06 Python
python中温度单位转换的实例方法
2020/12/27 Python
Python3利用scapy局域网实现自动多线程arp扫描功能
2021/01/21 Python
美国孩之宝玩具官网:Hasbro Pulse
2019/06/24 全球购物
优秀教师感人事迹材料
2014/05/04 职场文书
小学三八妇女节活动总结
2015/02/06 职场文书
个人廉政承诺书
2015/04/28 职场文书
MySQL不使用order by实现排名的三种思路总结
2021/06/02 MySQL
Mybatis-Plus 使用 @TableField 自动填充日期
2022/04/26 Java/Android