图形验证码

1、安装
	cnpm install --save svg-captcha

2、导入
	var svgCaptcha = require('svg-captcha');

3、使用
	var captcha = svgCaptcha.create({
		
	    size: 4,   			  随机字符串的长度
	    ignoreChars: '0o1i',  忽略不出现的随机字符串
	    noise: 1,   		  干扰线的条数
	    color: true,  	      字符随机颜色
	    background: '#cc9966', 图片背景色
	    width: , 
	    height: ,
	    fontSize: , 
	    charPreset: string  预置字符串内容

	});

4、生成
	captcha.text:图形验证码的内容
	captcha.data:图形验证码svg

5、后台发送
	res.type('svg');   设置返回文件类型,不设置将返回普通字符串,使用innerHTML才能解析
	res.send(captcha.data);
	
6、前台使用
	<img src='路径' />
		src会请求url路径
		配合点击事件在路径后面加上如时间戳等,区别不同请求,否则只会返回一次
		
7、前后端验证
	后台通过session,将captcha.text存入
	前台输入验证码内容后进行比对

代码示例:
后台

引入省略
router.get('/api/captcha', (req, res)=>{
    var captcha = svgCaptcha.create({
        size:4,
        color:true,
        noise:2,
        ignoreChars: '0o1i'
    });

    req.session.captcha=captcha.text.toLocaleLowerCase();
    res.type('svg');
    res.send(captcha.data);
});

前台:

  <img
    ref="captcha"
    class="get-verification"
    src="http://localhost:3000/api/captcha"
    alt="captcha"
    @click.prevent="getCaptcha()"
  >
  ...
  getCaptcha()
  {
    this.$refs.captcha.src="http://127.0.0.1:3000/api/captcha?time="+new Date();

  }