blog.liushichen.com

nodejs生成验证码

2017-11-28

前言

大家都知道原来php有个GD库可以做图片验证码，那么nodejs如何做验证码？带着这个疑问我在google上展开了各种搜索。
终于找到了node-canvas这个node图形包。其原理就是nodejs通过这个包实现了nodejs版本的 canvas 语法，通过调用底层的c语言包来绘制canvas并生成图片。这里只说如何使用，原理不再纠结。

如何安装

安装前请先安装node-canvas依赖的底层包。

Mac HomeBrew 安装

1	brew install pkg-config cairo pango libpng jpeg giflib

lunix安装

1	sudo apt-get install libcairo2-dev libjpeg8-dev libpango1.0-dev libgif-dev build-essential g++

Windows安装

这里windows安装笔记繁琐，所有直接去github查看wiki

以上底层依赖安装好后执行

1	npm install canvas

目前npm下载的是1版本，最新版本请执行

1	npm install canvas@next

nodejs生成验证码demo

const express = require('express'); //express
const app = express();
const consolidate = require('consolidate');
app.set('view engine', 'html');
app.set('views', './views');
app.engine('html', consolidate.ejs);
const Canvas = require('canvas');// node-canvas
const Image = Canvas.Image
function mackimage(){
	var canvas = new Canvas(80,40)
    var ctx = canvas.getContext('2d');
	ctx.font = '20px Impact';
	var text=['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','L','Y','Z','0','1','2','3','4','5','6','7','8','9'];
	var randomarr=[];
	for(var i=0;i<4;i++){
		var random = Math.ceil(Math.random()*35);
	    randomarr.push(text[random]);
	}
	ctx.fillText(randomarr.join(''), 10, 30);//canvas 加入随机4位数
	var te = ctx.measureText(randomarr.join(''));
	ctx.strokeStyle = 'rgba(0,0,0,0.5)';
	ctx.beginPath();
	ctx.lineTo(50, 102);
	ctx.lineTo(50 + te.width, 102);
	ctx.stroke();

	return canvas.toDataURL();//canvas转img src data64地址
}
//主页面
app.get('/',(req,res)=>{
	res.render('index.ejs')
});
//返回验证码图片src
app.get('/getcode',(req,res)=>{
	res.send(mackimage());
});
app.listen(3000);

node验证码demo下载

百度网盘传送门

提取密码：w2zw

下载完成后解压缩,安装本文上述依赖包后

cd node-canvas

npm i

node server.js

打开浏览器输入localhost:3000/   查看效果

日本镰仓朝圣之旅

2017-11-27

《灌篮高手》（SLAMDUNK，日语：スラムダンク）

十一假期去了趟日本，其中日本的神奈川县镰仓是必去的朝圣地点（灌篮高手片头曲出现的海边十字路口）。

漫画原型截图

实景照片(由于去的时候游客太多，自己站到一个高抬上勉强拍摄的)

PS:神奈川县立镰仓高等学校
这个学校就在这个著名的海边车站不远，这所高中其实就是湘北的原型，由于漫画太过出名，每天这里都有来自世界各地的漫迷在门口的合影留念，当然我也不例外23333

当年灌篮高手无论在中学或高中都十分火爆，这部动漫陪伴我们一代人成长的动漫，在我们成长的足迹里留下了深深的烙印。
如今有幸亲临现场，内心仿佛又变了当年10几岁的追风少年。
如今这个少年在另一个城市的CBD的某个大楼里成了IT大军里的一员。
当然现在一年也可以打2到3次球。哈哈，欢迎约篮球~

再见，青春。