国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

JavaScript生成圖形驗證碼

2019-11-19 16:11:19
字體:
來源:轉載
供稿:網友

本文實例為大家分享了js生成圖形驗證碼的具體代碼,供大家參考,具體內容如下

getGVerify:function (id)  {     function GVerify(options) { //創建一個圖形驗證碼對象,接收options對象為參數      this.options = { //默認options參數值        id: "", //容器Id        canvasId: "verifyCanvas", //canvas的ID        width: "100", //默認canvas寬度        height: "30", //默認canvas高度        type: "blend", //圖形驗證碼默認類型blend:數字字母混合類型、number:純數字、letter:純字母        code: ""      }       if(Object.prototype.toString.call(options) == "[object Object]"){//判斷傳入參數類型        for(var i in options) { //根據傳入的參數,修改默認參數值          this.options[i] = options[i];        }      }else{        this.options.id = options;      }       this.options.numArr = "0,1,2,3,4,5,6,7,8,9".split(",");      this.options.letterArr = getAllLetter();       this._init();      this.refresh();    }     GVerify.prototype = {      /**版本號**/      version: '1.0.0',       /**初始化方法**/      _init: function() {        var con = document.getElementById(this.options.id);        var canvas = document.createElement("canvas");        /*this.options.width = con.offsetWidth > 0 ? con.offsetWidth : "100";        this.options.height = con.offsetHeight > 0 ? con.offsetHeight : "30";*/        canvas.id = this.options.canvasId;        canvas.width = this.options.width;        canvas.height = this.options.height;        canvas.style.cursor = "pointer";        canvas.innerHTML = "您的瀏覽器版本不支持canvas";        con.appendChild(canvas);        var parent = this;        canvas.onclick = function(){          parent.refresh();        }      },       /**生成驗證碼**/      refresh: function() {        this.options.code = '';        var canvas = document.getElementById(this.options.canvasId);        if(canvas.getContext) {          var ctx = canvas.getContext('2d');        }        ctx.textBaseline = "middle";         ctx.fillStyle = randomColor(180, 240);        ctx.fillRect(0, 0, this.options.width, this.options.height);         if(this.options.type == "blend") { //判斷驗證碼類型          var txtArr = this.options.numArr.concat(this.options.letterArr);        } else if(this.options.type == "number") {          var txtArr = this.options.numArr;        } else {          var txtArr = this.options.letterArr;        }         for(var i = 1; i <= 4; i++) {          var txt = txtArr[randomNum(0, txtArr.length)];          this.options.code += txt;          ctx.font = '20px SimHei';          //ctx.font = randomNum(this.options.height/2, this.options.height) + 'px SimHei'; //隨機生成字體大小          ctx.fillStyle = randomColor(50, 160); //隨機生成字體顏色          /* ctx.shadowOffsetX = randomNum(-3, 3);          ctx.shadowOffsetY = randomNum(-3, 3);*/          ctx.shadowBlur = randomNum(-3, 3);          ctx.shadowColor = "rgba(0, 0, 0, 0.3)";          var x = this.options.width / 5 * i;          var y = this.options.height / 2;          var deg = randomNum(-30, 30);          /**設置旋轉角度和坐標原點**/          ctx.translate(x, y);          ctx.rotate(deg * Math.PI / 180);          ctx.fillText(txt, 0, 0);          /**恢復旋轉角度和坐標原點**/          ctx.rotate(-deg * Math.PI / 180);          ctx.translate(-x, -y);        }        /**繪制干擾線**/        for(var i = 0; i < 4; i++) {          ctx.strokeStyle = randomColor(40, 180);          ctx.beginPath();          ctx.moveTo(randomNum(0, this.options.width/2), randomNum(0, this.options.height/2));          ctx.lineTo(randomNum(0, this.options.width/2), randomNum(0, this.options.height));          ctx.stroke();        }        /**繪制干擾點**/        for(var i = 0; i < this.options.width/4; i++) {          ctx.fillStyle = randomColor(0, 255);          ctx.beginPath();          ctx.arc(randomNum(0, this.options.width), randomNum(0, this.options.height), 1, 0, 2 * Math.PI);          ctx.fill();        }      },       /**驗證驗證碼**/      validate: function(code){        var verifyCode = code.toLowerCase();        var v_code = this.options.code.toLowerCase();        if(verifyCode == v_code){          return true;        }else{          return false;        }      }    }     /**生成字母數組**/    function getAllLetter() {      var letterStr = "a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z";      return letterStr.split(",");    }    /**生成一個隨機數**/    function randomNum(min, max) {      return Math.floor(Math.random() * (max - min) + min);    }    /**生成一個隨機色**/    function randomColor(min, max) {      var r = randomNum(min, max);      var g = randomNum(min, max);      var b = randomNum(min, max);      return "rgb(" + r + "," + g + "," + b + ")";    }     return new GVerify(id);  }

調用方法

var verifyCode = new GVerify(id);

驗證方法

if(verifyCode.validate(inputCode)){   return true;}esle{   return false;}

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 民县| 房山区| 凌海市| 漳浦县| 芜湖县| 玉田县| 武城县| 泾川县| 福海县| 鞍山市| 昌黎县| 蒙阴县| 山丹县| 新民市| 永修县| 长沙市| 江安县| 确山县| 乐都县| 元氏县| 甘泉县| 屏东县| 叶城县| 通江县| 响水县| 共和县| 东乡| 磐石市| 海南省| 福海县| 和静县| 河北省| 石台县| 湘潭县| 岱山县| 平顺县| 汕头市| 彩票| 琼海市| 正定县| 化德县|