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 相关文章推荐
jQuery中append()方法用法实例
Jan 08 Javascript
Bootstrap3 datetimepicker控件使用实例
Dec 13 Javascript
Bootstrap和Java分页实例第一篇
Dec 23 Javascript
AngularJS实现使用路由切换视图的方法
Jan 24 Javascript
动态加载、移除js/css文件的示例代码
Mar 20 Javascript
小程序兼容安卓和IOS数据处理问题及坑
Sep 18 Javascript
javascript移动端 电子书 翻页效果实现代码
Sep 07 Javascript
vue给对象动态添加属性和值的实例
Sep 09 Javascript
解决layui数据表格Date日期格式的回显Object的问题
Sep 19 Javascript
解决LayUI数据表格复选框不居中显示的问题
Sep 25 Javascript
高效jQuery选择器的5个技巧实例分析
Nov 26 jQuery
vue打开新窗口并实现传参的图文实例
Mar 04 Vue.js
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
长波知识介绍
2021/03/01 无线电
PHP备份/还原MySQL数据库的代码
2011/01/06 PHP
解析php中die(),exit(),return的区别
2013/06/20 PHP
解决PHP4.0 和 PHP5.0类构造函数的兼容问题
2013/08/01 PHP
CodeIgniter表单验证方法实例详解
2016/03/03 PHP
php 猴子摘桃的算法
2017/06/20 PHP
PHP中如何使用Redis接管文件存储Session详解
2018/11/28 PHP
windows系统php环境安装swoole具体步骤
2021/03/04 PHP
Ajax异步提交表单数据的说明及方法实例
2013/06/22 Javascript
jQuery学习之prop和attr的区别示例介绍
2013/11/15 Javascript
Iframe 自动适应页面的高度示例代码
2014/02/26 Javascript
js调试工具console.log()方法查看js代码的执行情况
2014/08/08 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
2016/06/12 Javascript
微信小程序 弹幕功能简单实例
2017/02/14 Javascript
微信小程序微信支付接入开发实例详解
2017/04/12 Javascript
JavaScript实现的选择排序算法实例分析
2017/04/14 Javascript
JQuery实现图片轮播效果
2017/05/08 jQuery
JS实现问卷星自动填问卷脚本并在两秒自动提交功能
2020/06/17 Javascript
在vue+element ui框架里实现lodash的debounce防抖
2019/11/13 Javascript
vue在线动态切换主题色方案
2020/03/26 Javascript
详解node.js创建一个web服务器(Server)的详细步骤
2021/01/15 Javascript
Python使用multiprocessing创建进程的方法
2015/06/04 Python
Python利用Beautiful Soup模块修改内容方法示例
2017/03/27 Python
详解Python安装tesserocr遇到的各种问题及解决办法
2019/03/07 Python
python Tcp协议发送和接收信息的例子
2019/07/22 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
html5关于外链嵌入页面通信问题(postMessage解决跨域通信)
2020/07/20 HTML / CSS
莫斯科高科技在线商店:KremlinStore
2019/03/13 全球购物
安全教育心得体会
2013/12/29 职场文书
《狐假虎威》教学反思
2014/02/07 职场文书
教师专业自荐书范文
2014/02/10 职场文书
2014乡镇“三八”国际劳动妇女节活动总结
2014/03/01 职场文书
房产销售独家委托书范本
2014/10/01 职场文书
小学生必读成语故事大全:送给暑假的你们
2019/07/09 职场文书
IDEA 链接Mysql数据库并执行查询操作的完整代码
2021/05/20 MySQL
Redis 彻底禁用RDB持久化操作
2021/07/09 Redis