Jsp中通過IO流讀取驗證碼並展示到頁面

要想在頁面上生成驗證碼，首先要創建驗證碼圖片生成類VerfiCode類，該類是一個產生驗證碼圖片的類，該類代碼如下：

package com.Myweb.util;
import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.OutputStream;
import java.util.Random;


import javax.imageio.ImageIO;


public class VerifyCode {
private int w = 70;
private int h = 35;
  private Random r = new Random();
  // {"宋體", "華文楷體", "黑體", "華文新魏", "華文隸書", "微軟雅黑", "楷體_GB2312"}
private String[] fontNames  = {"宋體", "華文楷體", "黑體", "微軟雅黑", "楷體_GB2312"};
private String codes  = "23456789abcdefghjkmnopqrstuvwxyzABCDEFGHJKMNPQRSTUVWXYZ";
private Color bgColor  = new Color(255, 255, 255);
private String text ;

private Color randomColor () {
int red = r.nextInt(150);
int green = r.nextInt(150);
int blue = r.nextInt(150);
return new Color(red, green, blue);
}

private Font randomFont () {
int index = r.nextInt(fontNames.length);
String fontName = fontNames[index];
int style = r.nextInt(4);
int size = r.nextInt(5) + 24; 
return new Font(fontName, style, size);
}

private void drawLine (BufferedImage image) {
int num  = 3;
Graphics2D g2 = (Graphics2D)image.getGraphics();
for(int i = 0; i < num; i++) {
int x1 = r.nextInt(w);
int y1 = r.nextInt(h);
int x2 = r.nextInt(w);
int y2 = r.nextInt(h); 
g2.setStroke(new BasicStroke(1.5F)); 
g2.setColor(Color.BLUE); 
g2.drawLine(x1, y1, x2, y2);
}
}

private char randomChar () {
int index = r.nextInt(codes.length());
return codes.charAt(index);
}

private BufferedImage createImage () {
BufferedImage image = new BufferedImage(w, h, BufferedImage.TYPE_INT_RGB); 
Graphics2D g2 = (Graphics2D)image.getGraphics(); 
g2.setColor(this.bgColor);
g2.fillRect(0, 0, w, h);
  return image;
}

public BufferedImage getImage () {
BufferedImage image = createImage(); 
Graphics2D g2 = (Graphics2D)image.getGraphics();
StringBuilder sb = new StringBuilder();
// 向圖片中畫4個字符
for(int i = 0; i < 4; i++)  {
String s = randomChar() + ""; 
sb.append(s); 
float x = i * 1.0F * w / 4; 
g2.setFont(randomFont()); 
g2.setColor(randomColor()); 
g2.drawString(s, x, h-5); 
}
this.text = sb.toString(); 
drawLine(image); 
return image;
}

public String getText () {
return text;
}

public static void output (BufferedImage image, OutputStream out) 
throws IOException {
ImageIO.write(image, "JPEG", out);
}

}

2.通過servlet來獲取到產生的頁面圖片，通過流的方式寫入到Image中；

package com.Myweb.MyServlet;


import java.awt.image.BufferedImage;
import java.io.IOException;


import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


import com.Myweb.util.VerifyCode;






@SuppressWarnings("serial")
@WebServlet(urlPatterns="/VerifyCodeServlet")
public class VerifyCodeServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
VerifyCode vc = new VerifyCode();
BufferedImage image = vc.getImage();//獲取一次性驗證碼圖片
// 該方法必須在getImage()方法之後來調用
// System.out.println(vc.getText());//獲取圖片上的文本
VerifyCode.output(image, response.getOutputStream());//把圖片寫到指定流中


}
}

3.Jsp頁面中接受驗證碼

<img  alt="" src="VerifyCodeServlet" id="img1" onclick="refresh()">

4.js編寫刷新驗證碼操作：

 function refresh(){
    var src=$("#img1").attr("src");//返回被選元素的屬性值
    $("#img1").attr("src",src+"?"+new Date());
    

    }

這樣驗證碼生成就完成了，效果如下：