客户端技术大牛揭秘了 Js也能实现验证码

 

很多时候我们生成验证码都是在服务器生成的，但是你知不知道其实在客户端用js也可能用来生成验证码呢，今天客户端大牛就来揭密，如何使用js方便地在浏览器上生成验证码，从而降低服务器的压力，下面就是一段技术代码，每位想要学习的就快点来过围观吧。

 

function validate()

{

/*    var str="";

    var code = form1.CODE.value;

 var spans = document.getElementById("divCode").all;

 for(var i=0;i<4;i++)

    str = str+spans[i].innerHTML;

    if(str != code)

   alert("输入验证码有误!");*/

     var sso =getCookie("sso_code");

  var str= sso.toString();

  var temp = "";

  for(var i=0;i<str.length;i++)

  {

     if(str.charAt(i) != ',')

  temp = temp+str.charAt(i);

  }

     alert(temp);

     var code = form1.CODE.value;

  alert(code);

     if(code != temp)

    alert("输入验证码有误!");

}

function validteCode()

{

    var codes = newArray(4);       //用于存储随机验证码

    var colors = new Array("Red","Green","Gray","Blue","Maroon","Aqua","Fuchsia","Lime","Olive","Silver");

    for(var i=0;i < codes.length;i++)

    {//获取随机验证码

        codes[i] =Math.floor(Math.random()*10);

    }

    //把随机生成的值存储在cookie里。

    setCookie("sso_code",codes);

    var spans =document.getElementById("divCode").all;

    for(var i=0;i<spans.length;i++)

    {

        spans[i].innerHTML=codes[i];

        spans[i].style.color =colors[Math.floor(Math.random()*10)];    //随机设置验证码颜色

       

    }

 

}

document.onload = validteCode();

上面这一段大家可以看到是用cookie存的验证码，而用span来显示出来，这里只是为了方便演示，用span当然是不可靠的，但是能用span我们也能通过其他的方式用在生成图片上面，用js生成图片的方法太多了，这里没有罗列这些技术。还有一个问题，那就是cookie的安全性考虑，好像不大轻易做到保密，但是其实可以使用一些保密算法来保证。这里只是提供一种思路，实用性方面不好做判断。