使用

svg-captcha包实现验证码生成

const svgCaptcha = require('svg-captcha');

生成验证码 返回图片格式
async generateVerifCode() {
    const codeConfig = {
      size: 4, // 验证码长度
      ignoreChars: '0oO1ilI', // 验证码字符中排除 0oO1ilI
      noise: 2, // 干扰线条的数量
      width: 160,
      height: 50,
      fontSize: 50,
      color: true, // 验证码的字符是否有颜色，默认没有，如果设定了背景，则默认有
      background: '#eee',
    };
    const captcha = svgCaptcha.create(codeConfig);
    this.ctx.session.verifCode = captcha.text.toLowerCase(); // 存session用于验证接口获取文字码
    this.ctx.body = captcha.data;
  }

前端请求生成验证码

                        <tr id="yzm_tr">
                            <td>
                                <img class="password"src="/public/admin/img/password.png" style="position: absolute;    margin: 1% 1%;"/>
                                <input type="text" id="verif_code" placeholder="请输入验证码" tabindex="1">
                                <a href="javascript:;" id = "yzm" style="position: absolute;    margin-left: 1% ;" ></a>
                            </td>
                        </tr>

        function initVerifCode(){             $.ajax({                 url:"/verifCode?t="+Math.random(),                 type:"GET",                 success:function(data){                     $("#yzm").empty().html(data);                 }             })         }

完成了一套验证码从生成到验证的功能