Struts2显示图片验证码
本文分三个步骤介绍验证码图片生成以及与Struts2结合使用。
Step 1.随机验证码
一步一步来，要生成验证码图片，首先要有验证码，然后才能在画在图片上。为了能够灵活控制验证码，特别编写了SecurityCode类，它向 外提供随机字符串。并且可以控制字符串的长度和难度。SecurityCode类中提供的验证码分三个难度，易（全数字）、中（数字+小写英文）、难（数 字+大小写英文）。难度使用枚举SecurityCodeLevle表示，避免使用1、2、3这样没有明确意义的数字来区分。
同时，还控制了能否出现重复的字符。为了能够方便使用，方法设计为static。
SecurityCode类：
import java.util.Arrays;
public class SecurityCode {
public enum SecurityCodeLevel {
Simple, Medium, Hard
};
public static String getSecurityCode() {
return getSecurityCode(4, SecurityCodeLevel.Medium, false);
}
public static String getSecurityCode(int length, SecurityCodeLevel level,
boolean isCanRepeat) {
// 随机抽取len个字符
int len = length;
// 字符集合(除去易混淆的数字0、数字1、字母l、字母o、字母O)
char[] codes = { '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b',
'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'm', 'n', 'p',
'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B',
'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N',
'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z' };
// 根据不同的难度截取字符数组
if (level == SecurityCodeLevel.Simple) {
codes = Arrays.copyOfRange(codes, 0, 9);
} else if (level == SecurityCodeLevel.Medium) {
codes = Arrays.copyOfRange(codes, 0, 33);
}
// 字符集合长度
int n = codes.length;
// 抛出运行时异常
if (len > n && isCanRepeat == false) {
throw new RuntimeException(String.format("调用SecurityCode.getSecurityCode(%1$s,%2$s,%3$s)出现异常，当isCanRepeat为%3$s时，传入参数%1$s不能大于%4$s", len, level, isCanRepeat, n));
}
// 存放抽取出来的字符
char[] result = new char[len];
// 判断能否出现重复的字符
if (isCanRepeat) {
for (int i = 0; i < result.length; i++) {
// 索引 0 and n-1
int r = (int) (Math.random() * n);
// 将result中的第i个元素设置为codes[r]存放的数值
result[i] = codes[r];
}
} else {
for (int i = 0; i < result.length; i++) {
// 索引 0 and n-1
int r = (int) (Math.random() * n);
// 将result中的第i个元素设置为codes[r]存放的数值
result[i] = codes[r];
// 必须确保不会再次抽取到那个字符，因为所有抽取的字符必须不相同。
// 因此，这里用数组中的最后一个字符改写codes[r]，并将n减1
codes[r] = codes[n - 1];
n--;
}
}
return String.valueOf(result);
}
}
Step 2.图片
第一步已经完成，有了上面SecurityCode类提供的验证码，就应该考虑怎么在图片上写字符串了。在Java中操作图片，需要使用 BufferedImage类，它代表内存中的图片。写字符串，就需要从图片BufferedImage上得到绘图图面Graphics，然后在图面上 drawString。
为了使验证码有一定的干扰性，也绘制了一些噪点。调用Graphics类的drawRect绘制1*1大小的方块就可以了。
特别说明一下，由于后面要与Strtus2结合使用，而在Struts2中向前台返回图片数据使用的是数据流的形式。所以提供了从图片向流的转换方法convertImageToStream。
SecurityImage类：
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.ByteArrayInputStream;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.util.Random;
import com.sun.image.codec.jpeg.ImageFormatException;
import com.sun.image.codec.jpeg.JPEGCodec;
import com.sun.image.codec.jpeg.JPEGImageEncoder;
public class SecurityImage {
public static BufferedImage createImage(String securityCode) {
// 验证码长度
int codeLength = securityCode.length();
// 字体大小
int fSize = 15;
int fWidth = fSize + 1;
// 图片宽度
int width = codeLength * fWidth + 6;
// 图片高度
int height = fSize * 2 + 1;
// 图片
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
Graphics g = image.createGraphics();
// 设置背景色
g.setColor(Color.WHITE);
// 填充背景
g.fillRect(0, 0, width, height);
// 设置边框颜色
g.setColor(Color.LIGHT_GRAY);
// 边框字体样式
g.setFont(new Font("Arial", Font.BOLD, height - 2));
// 绘制边框
g.drawRect(0, 0, width - 1, height - 1);
// 绘制噪点
Random rand = new Random();
// 设置噪点颜色
g.setColor(Color.LIGHT_GRAY);
for (int i = 0; i < codeLength * 6; i++) {
int x = rand.nextInt(width);
int y = rand.nextInt(height);
// 绘制1*1大小的矩形
g.drawRect(x, y, 1, 1);
}
// 绘制验证码
int codeY = height - 10;
// 设置字体颜色和样式
g.setColor(new Color(19, 148, 246));
g.setFont(new Font("Georgia", Font.BOLD, fSize));
for (int i = 0; i < codeLength; i++) {
g.drawString(String.valueOf(securityCode.charAt(i)), i * 16 + 5,
codeY);
}
// 关闭资源
g.dispose();
return image;
}
public static ByteArrayInputStream getImageAsInputStream(String securityCode) {
BufferedImage image = createImage(securityCode);
return convertImageToStream(image);
}
private static ByteArrayInputStream convertImageToStream(BufferedImage image) {
ByteArrayInputStream inputStream = null;
ByteArrayOutputStream bos = new ByteArrayOutputStream();
JPEGImageEncoder jpeg = JPEGCodec.createJPEGEncoder(bos);
try {
jpeg.encode(image);
byte[] bts = bos.toByteArray();
inputStream = new ByteArrayInputStream(bts);
} catch (ImageFormatException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return inputStream;
}
}
Step 3.验证码与Struts 2结合
1)Action
有了上面两步操作作为铺垫，含有验证码的图片就不成问题了，下面就可以使用Struts2的Action向前台返回图片数据了。
SecurityCodeImageAction类：
import java.io.ByteArrayInputStream;
import javax.servlet.http.HttpServletRequest;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
import com.struts2.utils.SecurityCode;
import com.struts2.utils.SecurityImage;
public class ValidCodeAction extends ActionSupport {
private static final long serialVersionUID = 5633780176793520460L;
//图片流
private ByteArrayInputStream imageStream;
@Override
public String execute() throws Exception {
// TODO Auto-generated method stub
try {
HttpServletRequest request = ServletActionContext.getRequest();
String securityCode = SecurityCode.getSecurityCode();
imageStream = SecurityImage.getImageAsInputStream(securityCode);
//放入session中
//session.put("securityCode", securityCode);
System.out.println("securityCode = " + securityCode);
request.getSession().setAttribute("securityCode", securityCode);
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}
public ByteArrayInputStream getImageStream() {
return imageStream;
}
public void setImageStream(ByteArrayInputStream imageStream) {
this.imageStream = imageStream;
}
}
2)Struts.xml
在 Struts.xml配置文件中，需要配置SecurityCodeImageAction，由于现在返回的是流，就不应该再使用普通的方式了，应该在result上加上type="stream"。
同时这一项的值，应该与SecurityCodeImageAction中的图片流名称一致。
Struts.xml：
1 <action name="SecurityCodeImageAction" class="securityCodeImageAction"> 2 <resultname="success" type="stream"> 3 <param name="contentType">image/jpegparam> 4<param name="inputName">imageStreamparam> 5 <paramname="bufferSize">2048param> 6 result> 7 action>
3)前台JSP
定义一个img元素，将src指向SecurityCodeImageAction就可以了，浏览器向Action发送请求，服务器将图片流返回，图片就能够显示了。
1 <img src="SecurityCodeImageAction" id="Verify" style="cursor:hand;" alt="看不清，换一张"/>
4)JS
验证码一般都有点击刷新的功能，这个也容易实现，点击图片，重新给图片的src赋值。但是这时，浏览器会有缓存问题，如果浏览器发现src中的url不 变，就认为图片没有改变，就会使用缓存中的图片，而不是重新向服务器请求。解决办法是在url后面加上一个时间戳，每次点击时，时间戳都不一样，浏览器就 认为是新的图片，然后就发送请求了。
jQuery：
1 $(function () { 2 //点击图片更换验证码 3 $("#Verify").click(function(){ 4$(this).attr("src","SecurityCodeImageAction?timestamp="+new Date().getTime()); 5 }); 6 });
JavaScript:
1 window.οnlοad=function(){ 2 var verifyObj = document.getElementByIdx_x("Verify"); 3verifyObj.οnclick=function(){ 4 this.src="SecurityCodeImageAction?timestamp="+newDate().getTime(); 5 }; 6 }
5)效果
生成的验证码图片如下所示，浅蓝色的字体，浅灰色的噪点。
图：验证码
结束： 经过上面的三个步骤，Struts2 结合验证码的例子就介绍完了。
自己总结：