js生成的验证码的实现与技术分析
分享给大家一段js生成验证码并验证的代码
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS生成验证码</title>
<styletype="text/css">
.code{
background-image:url(code.jpg);
font-family:Arial;
font-style:italic;
color:Red;
border:0;
padding:2px3px;
letter-spacing:3px;
font-weight:bolder;
}
.unchanged{
border:0;
}
</style>
<scriptlanguage="javascript"type="text/javascript">
varcode;//在全局定义验证码
functioncreateCode(){
code="";
varcodeLength=6;//验证码的长度
varcheckCode=document.getElementById("checkCode");
varselectChar=newArray(0,1,2,3,4,5,6,7,8,9,'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');//所有候选组成验证码的字符，当然也可以用中文的
for(vari=0;i<codeLength;i++){
varcharIndex=Math.floor(Math.random()*36);
code+=selectChar[charIndex];
}
//alert(code);
if(checkCode){
checkCode.className="code";
checkCode.value=code;
}
}
functionvalidate(){
varinputCode=document.getElementById("input1").value;
if(inputCode.length<=0){
alert("请输入验证码！");
}elseif(inputCode!=code){
alert("验证码输入错误！");
createCode();//刷新验证码
}else{
alert("^-^OK");
}
}
</script>
</head>
<bodyonload="createCode()">
<formaction="#">
<inputtype="text"id="input1"/><inputtype="text"onclick="createCode()"readonly="readonly"id="checkCode"class="unchanged"style="width:80px"/><br/>
<inputid="Button1"onclick="validate();"type="button"value="确定"/>
</form>
</body>
</html>
众所周知，js是客户端的，那么把验证都做在客户端有意义吗？还是必须从服务器生成的验证码安全啊？前端生成的验证码安全吗？
验证码是动态的，但要由客户端识别，并返回正确数值才能正常验证。这是一个流程问题，如果js的，那就是在客户端处验证，基本等于没有一样！！！最好是服务器生成，客户端验证，服务器确认，正常浏览。这样一个流程就万无一失
所以，本文仅仅是技术探讨而已，千万别用在实际生产项目中