nodejs 實現登錄驗證碼

使用

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);

                }

            })

        }

完成了一套驗證碼從生成到驗證的功能