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 相关文章推荐
用unescape反编码得出汉字示例
Apr 24 Javascript
Express作者TJ告别Node.js奔向Go
Jul 14 Javascript
javascript 操作符(~、&amp;、|、^、)使用案例
Dec 31 Javascript
使用console进行性能测试
Apr 27 Javascript
深入分析Javascript事件代理
Jan 30 Javascript
Javascript中click与blur事件的顺序详析
Apr 25 Javascript
React-Native左右联动List的示例代码
Sep 21 Javascript
AngularJS实现的select二级联动下拉菜单功能示例
Oct 25 Javascript
详解如何制作并发布一个vue的组件的npm包
Nov 10 Javascript
详解JS实现系统登录页的登录和验证
Apr 29 Javascript
Layui 带多选框表格监听事件以及按钮自动点击写法实例
Sep 02 Javascript
在Vuex中Mutations修改状态操作
Jul 24 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 和 MySQL 时区的一点总结
2008/03/26 PHP
php用正则表达式匹配URL的简单方法
2013/11/12 PHP
PHP生成plist数据的方法
2015/06/16 PHP
PHP实现支持加盐的图片加密解密
2016/09/09 PHP
jquery 简单的进度条实现代码
2010/03/11 Javascript
window.location.href IE下跳转失效的解决方法
2014/03/27 Javascript
jquery中$(#form :input)与$(#form input)的区别
2014/08/18 Javascript
javascript中Date format(js日期格式化)方法小结
2015/12/17 Javascript
微信小程序 MINA文件结构
2016/10/17 Javascript
微信小程序 require机制详解及实例代码
2016/12/14 Javascript
JS 在数组指定位置插入/删除数据的方法
2017/01/12 Javascript
从零开始学习Node.js系列教程四:多页面实现数学运算的client端和server端示例
2017/04/13 Javascript
浅析vue 函数配置项watch及函数 $watch 源码分享
2018/11/22 Javascript
原生js实现的移动端可拖动进度条插件功能详解
2019/08/15 Javascript
在vue中实现清除echarts上次保留的数据(亲测有效)
2020/09/09 Javascript
python批量生成本地ip地址的方法
2015/03/23 Python
python对url格式解析的方法
2015/05/13 Python
python任务调度实例分析
2015/05/19 Python
Python守护进程和脚本单例运行详解
2017/01/06 Python
Python脚本实现自动将数据库备份到 Dropbox
2017/02/06 Python
Python爬虫爬取新浪微博内容示例【基于代理IP】
2018/08/03 Python
Python I/O与进程的详细讲解
2019/03/08 Python
Django Python 获取请求头信息Content-Range的方法
2019/08/06 Python
python selenium登录豆瓣网过程解析
2019/08/10 Python
Urban Outfitters德国官网:美国跨国生活方式零售公司
2018/05/21 全球购物
美国在线购买内衣网站:HerRoom
2020/02/22 全球购物
外语专业毕业生个人的自荐信
2013/11/19 职场文书
见习期自我鉴定
2014/01/31 职场文书
就职演讲稿范文
2014/05/19 职场文书
2014个人四风对照检查材料思想汇报
2014/09/18 职场文书
2014党员自我评议表范文
2014/09/20 职场文书
材料员岗位职责
2015/02/10 职场文书
竞聘演讲报告:基本写作有哪些?附开头范文
2019/10/16 职场文书
励志语录:只有自己足够强大,才能不被别人践踏
2020/01/09 职场文书
《最终幻想14》6.01版本4月5日推出 追加新任务新道具
2022/04/03 其他游戏
《艾尔登法环》1.03.3补丁上线 碎星伤害调整
2022/04/07 其他游戏