利用Ajax技术实现验证码的刷新和局部验证

<div class="iteye-blog-content-contain" style="font-size: 14px"></div>

先说点无关紧要的吧，两个知识点：

 (1)，方法一：使用Js局部刷新验证码的做法是在页面中加上一个img标签，src属性设为一个servlet或者.jsp来请求验证码图片，html代码如下:

<img src="ImageServlet" οnclick="refresh(this)"/>

 在一般情况下刷新一次页面，验证码图片也会变化一次，但有时候我们希望验证码图片变化时不刷新整个页面，也就是局部刷新的效果，代码如下：

js代码：

<

script type="text/javascript">
function refresh(obj){
obj.src="ImageServlet?id="+Math.random();
}
</script>

  其中需要注意的是请求路径中必须要有参数（参数名可随意定义），参数值不能是一个固定值而是随机数。 代码中obj对象是指img标签对象。

方法二：

html代码如下：

<img src="ImageServlet"  id="picture" ><span style='color:#0000cc'  οnclick="refresh()">看不清,换一张</span>

 js代码如下：

function refresh(){
	 document.getElementById("picture").src="ImageServlet?id="+Math.random();
}

  （2)，获取图片的ImageServlet代码如下：

package servlet;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;

import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.sun.image.codec.jpeg.JPEGCodec;
import com.sun.image.codec.jpeg.JPEGImageEncoder;

/**
 * Servlet implementation class ImageServlet
 */
public class ImageServlet extends HttpServlet {
// 定义可选择的字符
private static final String CHARS = "23456789abcdefghjkmnopqrstuvwxyzABCDEFGHJKLMNOPQRSTUVWXYZ";
static Random random = new Random();
 // 得到一个随机的字符串
private String getRandomString() {
StringBuffer buffer = new StringBuffer();
for (int i = 0; i < 4; i++) { // 生成四个字符
buffer.append(CHARS.charAt(random.nextInt(CHARS.length())));}
return buffer.toString();
}
// 随机背景颜色
public static Color getRandomColor() { // 得到随机颜色
return new Color(random.nextInt(128) + 127, random.nextInt(128) + 127,random.nextInt(128) + 127);
    }
    public static Color getReverseColor(Color c) { // 得到颜色的反色
	return new Color(255 - c.getRed(), 255 - c.getGreen(),
					255 - c.getBlue());
		}
  public void doGet(HttpServletRequest request, HttpServletResponse response)
				throws ServletException, IOException {
		response.setContentType("image/jpeg"); // 设置输出类型
     // 得到随机字符串
	String randomString = getRandomString();
			// 将getSession（）设置为true，当会话不存在是返回null
			request.getSession(true).setAttribute("randomString", randomString);
			// 设置图片的宽、高
			int width = 80;
			int height = 30;