jsp頁面動態生成驗證碼

該文章主要實現的功能是在jsp頁面中動態顯示驗證碼，點擊驗證碼能夠實現驗證碼的刷新。

驗證碼在前臺顯示的爲一張圖片，而該圖片是通過後臺Servlet生成的，原理爲：用Graphics畫出一張圖片，輸入BufferedImage圖片緩衝區中，然後通過ImageIO流輸出出來。前臺標籤爲<img/>標籤，img的src屬性指向Servlet，並通過img標籤的onclick事件調用Servlet，實現驗證碼圖片的刷新。

點擊刷新後:

jsp頁面代碼爲：

<tr>
	<td>
		驗證碼：
	</td>
	<td>
		<input type="text" name="validate" size="5" class="text" onBlur="checkCode()"/>
		   
		<img class="code" alt="點擊刷新" src="code" onclick="this.src='code?s='+new Date().getTime();" >
	</td>
	<td>
		<div id="checkCode" class="check">*</div>
	</td>
</tr>

CodeServlet代碼爲：

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

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

/**
 * 生成驗證碼的類
 * @author guduchina
 */
@SuppressWarnings("serial")
public class CodeServlet extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		this.doPost(request, response);
	}

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		response.setContentType("image/JPEG");
		ServletOutputStream out = response.getOutputStream();
		// 定義圖片的高度和寬度
		int width = 80;
		int height = 25;
		// 定義隨機數對象
		Random ran = new Random();
		// 定義圖片緩衝區，使用RGB模式輸出圖片
		BufferedImage image = new BufferedImage(width, height,
				BufferedImage.TYPE_INT_RGB);
		// 定義畫筆工具對象
		Graphics graphics = image.getGraphics();
		// 設置驗證碼框的背景顏色
		graphics.setColor(new Color(200, 200, 200));
		// 填充整個矩形
		graphics.fillRect(0, 0, width, height);
		// 定義要顯示的驗證碼
		StringBuffer sb = new StringBuffer("");
		// 定義驗證碼數組
		String[] code = { "A", "a", "B", "b", "C", "c", "D", "d", "E", "e",
				"F", "f", "G", "g", "H", "h", "I", "i", "J", "j", "K", "k",
				"L", "l", "M", "m", "N", "n", "O", "o", "P", "p", "Q", "q",
				"R", "r", "S", "s", "T", "t", "U", "u", "V", "v", "W", "w",
				"X", "x", "Y", "y", "Z", "z", "0", "1", "2", "3", "4", "5",
				"6", "7", "8", "9", "0", "1", "2", "3", "4", "5", "6", "7",
				"8", "9", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9",
				"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "1",
				"2", "3", "4", "5", "6", "7", "8", "9", "0", "1" };
		for (int i = 0; i < 4; i++) {
			String str = code[ran.nextInt(code.length)];
			// 設置顏色
			graphics.setColor(new Color(ran.nextInt(150), ran.nextInt(150), ran
					.nextInt(150)));
			// 設置字體
			graphics.setFont(new Font("宋體", Font.BOLD, 20));
			// 繪製驗證碼
			graphics.drawString(str, 20 * i+4, 20 - ran.nextInt(5));
			sb.append(str);
		}
		// 隨機產生100個干擾點
		for (int i = 0; i < 100; i++) {
			// 隨機生成干擾點的座標
			int x = ran.nextInt(width);
			int y = ran.nextInt(height);
			// 隨機生成干擾點的顏色
			graphics.setColor(new Color(ran.nextInt(185) + 40,
					ran.nextInt(185) + 40, ran.nextInt(185) + 40));
			// 設置干擾點的位置長寬
			graphics.drawOval(x, y, 1, 1);
		}
		String codeInfo = sb.toString();
		// 將驗證碼的值放到session中，以供前臺進行驗證
		request.getSession().setAttribute("code", codeInfo);
		// 將Image通過out輸出爲jpeg格式的圖片
		ImageIO.write(image, "JPEG", out);
		out.flush();
		out.close();
	}

}

然後就是web.xml配置代碼：

<servlet>
    <servlet-name>CodeServlet</servlet-name>
    <servlet-class>com.niit.cpw.servlet.CodeServlet</servlet-class>
  </servlet>

<servlet-mapping>
    <servlet-name>CodeServlet</servlet-name>
    <url-pattern>/code</url-pattern>
  </servlet-mapping>

這篇文章寫的是生成驗證碼的，還有一篇文章寫的是用jQuery+Ajax+Servlet進行驗證驗證碼是否正確，有興趣的朋友可以看看。