java验证码之MD5加密和ajax实现无刷新

首先我想说，大家都知道加密是怎么回事吧，像密码的话，不加密的话登陆时被黑客拦截就很容易被盗号啦。。。

验证码加密在我看来也就防止被暴力注册神马的。。。个人还是在sso的单点登陆（日后会做个总结）用加密比较多。

废话不多说，给代码就是了。。。

package com.util;

import java.security.MessageDigest;

public class Encode {

public String encode(String str, String algorithm) {

if (str == null) {

return null;

}

StringBuilder sb = new StringBuilder();//声明并实例化StringBuilder类的对象

try {

MessageDigest code = MessageDigest.getInstance(algorithm);//创建使用MD5加密算法的对象

code.update(str.getBytes());//将要加密信息中的所有字节提供给该对象

byte[] bs = code.digest();//调用digest方法完成消息摘要的计算，并以字节数组的形式返回消息摘要

//将加密后的字节数组转换成十六进制的字符串，形成最终的密文

for (int i = 0; i < bs.length; i++) {

int v = bs[i] & 0xFF;

if (v < 16) {

sb.append(0);

}

sb.append(Integer.toHexString(v));

}

} catch (Exception e) {

e.printStackTrace();

}

return sb.toString().toUpperCase();//将加密后的字符串中的英文字母转换为大写

}

public String encodeByMD5(String str){

return encode(str,"MD5");

}

}

神马是ajax实现验证码的无刷新验证呢？对ajax了解的都知道，就是不用加载整个页面，只需对验证码那块进行局部的刷新，就是我们常看到的“看不清？换一个”的效果。

我这里想实现的呢，是只有一个文本框，点击文本框后才出现验证码（当然出现的验证码也有“看不清可以换一个”及其效果），在输入验证码后呢，还有一个对比，如果输入正确，文本框后出现打钩字样，否则打叉（或者类似功能）。

 在生成隐藏的验证码时，首先应该控制验证码不显示，当用户单击验证码输入框时，才生成并显示验证码，然后还需要提供重新生成验证码的功能，接下来还需要在用户将光标移出验证码输入框时，控制验证码不显示，并应用Ajax实现无刷新判断输入的验证码是否正确，最后根据判断结果确定提交按钮是否可用。

恩，上面基本上是我能想到的最高级的实现了。由于代码量较多，我只说明一下技术要点。

1、css定位属性对验证码的显示位置进行确定，CSS样式的定位属性用于对html对像进行定位。在CSS样式中提供了position、z-index、top、right、bottom、left等7种定位属性。

使用div把验证码框分层分模块。下一段代码就是jsp里面验证码部分的代码

<div style="position:absolute">

<div id="showCheckCode" style="display:none; padding:3px" align="center" >

<img  src="images/checkCodePicture.jpg" id="createCheckCode" width="200" height="60">

<a href="#" style="color:#EEEEEE" onClick="getCheckCode1(showCheckCode,checkCode)">

看不清?换一个</a></div>

 <input name="checkCode" type="text" id="checkCode" size="6" value="" title="单击验证码输入框，获取验证码" onClick="getCheckCodeFun(showCheckCode,checkCode);"  onBlur="checkCheckCode(this.value)">

  </div>

2、应用JavaScript中的style元素对象。JavaScript中的style元素对象是html对象的一个属性。style元素对象提供了一组应用于浏览器所支持的CSS属性（如background、fontsize和display）使用style对象可以直接获取或设置单个html元素的CSS样式。设置

CSS样式表中的属性值的基本语法如下：

object.style.display=属性值

以下是生成验证码部分的js代码：

//生成并显示验证码

function getCheckCodeFun(showCheckCode,checkCode){

showCheckCode.style.display='';

if(document.getElementById("resultMessage").innerHTML=="温馨提示：单击验证码输入框，获取验证码！验证码区分大小写"){

getCheckCode1(showCheckCode,checkCode); //生成验证码

}

checkCode.focus();

}

//生成验证码

function getCheckCode1(showCheckCode,checkCode){

var loader1=new net.AjaxRequest("getPictureCheckCode.jsp?nocache="+new Date().getTime(),deal_getCheckCode,onerror,"GET");

showCheckCode.style.display='';

checkCode.focus();

}

function deal_getCheckCode(){

document.getElementById("showCheckCode").innerHTML=this.req.responseText;

}

//隐藏验证码显示框

function showCheckCodeClear(){

showCheckCode.style.display='none';

}

3、用ajax进行验证是否输入正确及改变在验证码输入框后面的验证结果显示

/***********验证验证码是否正确*******************************/

function checkCheckCode(inCheckCode){

if(inCheckCode!=""){

var loader=new net.AjaxRequest("checkCheckCode.jsp?inCheckCode="+inCheckCode+"&nocache="+new Date().getTime(),deal_checkCheckCode,onerror,"GET");

}

}

function deal_checkCheckCode(){

var h=this.req.responseText;

h=h.replace(/\s/g,""); //去除字符串中的Unicode空白符

if(h==1){

document.getElementById("resultMessage").removeChild(document.getElementById("resultMessage").childNodes[0]);

document.getElementById("resultMessage").appendChild(document.createTextNode(" "));

document.getElementById("messageImg").src="images/dui2.gif";

document.getElementById("resultMessage").removeChild(document.getElementById("resultMessage").childNodes[0]);

document.getElementById("resultMessage").appendChild(document.createTextNode("恭喜您，验证码正确！"));

document.getElementById("btn_Submit").disabled=false;

}else{

document.getElementById("messageImg").src="images/cuo2.gif";

document.getElementById("resultMessage").removeChild(document.getElementById("resultMessage").childNodes[0]);

document.getElementById("resultMessage").appendChild(document.createTextNode("您输入的验证码不正确！"));

}

}

jsp文本框后：

<td width="74%" valign="bottom" id="resultCheckCode" onClick="showCheckCodeClear()">&nbsp;

              <div id="resultMessage">温馨提示：单击验证码输入框，获取验证码！验证码区分大小写</div>

好了，大概这么多了，看不懂请留言。