image.jsp
//主要是采用下面导入的几个包来绘制 验证码图片
<%@ page import = "java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*" %>
<%@ page import = "java.io.OutputStream" %>
<%@ page pageEncoding= "gbk" %>
<%!Color getRandColor( int fc, int bc) {
Random random = new Random();
if (fc > 255 )
fc = 255 ;
if (bc > 255 )
bc = 255 ;
int r = fc + random.nextInt(bc - fc);
int g = fc + random.nextInt(bc - fc);
int b = fc + random.nextInt(bc - fc);
return new Color(r, g, b);
}%>
<%
try {
response.setHeader( "Pragma" , "No-cache" );
response.setHeader( "Cache-Control" , "no-cache" );
response.setDateHeader( "Expires" , 0 );
int width = 60 , height = 20 ;
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
OutputStream os = response.getOutputStream();
Graphics g = image.getGraphics();
Random random = new Random();
g.setColor(getRandColor( 200 , 250 ));
g.fillRect( 0 , 0 , width, height);
g.setFont( new Font( "Times New Roman" , Font.PLAIN, 18 ));
g.setColor(getRandColor( 150 , 200 ));
for ( int i = 0 ; i < 155 ; i++) {
int x = random.nextInt(width);
int y = random.nextInt(height);
int xl = random.nextInt( 12 );
int yl = random.nextInt( 12 );
g.drawLine(x, y, x + xl, y + yl);
}
String sRand = "" ;
for ( int i = 0 ; i < 4 ; i++) {
String rand = String.valueOf(random.nextInt( 10 ));
sRand += rand;
g.setColor( new Color( 20 + random.nextInt( 110 ), 20 + random
.nextInt( 110 ), 20 + random.nextInt( 110 )));
g.drawString(rand, 13 * i + 6 , 16 );
}
session.setAttribute( "rand" , sRand);
g.dispose();
ImageIO.write(image, "JPEG" , os);
os.flush();
os.close();
os = null ;
response.flushBuffer();
out.clear();
out = pageContext.pushBody();
} catch (IllegalStateException e) {
System.out.println(e.getMessage());
e.printStackTrace();
}
%>
//我把java代码封装到jsp里面,为了以下操作方便。
login.jsp(登录界面)
//我不把全部代码提出来了,既然这次主讲图片验证码,那么就把图片验证码部分代码贴出。
验 证 码
:
//pages/common/image.jsp是以上定义的image.jsp的路径
style="vertical-align: bottom" onClick="reloadImage(this);"
alt="图片看不清,点击换一张" onMouseOver="changeCursor(this);">
login.js
/**这个我也把关于验证码的js提出,如悬停图片时,鼠标变 手型,点击如片刷新 验证码**/
function changeCursor(obj)
{
obj.style.cursor = "pointer";
}
function reloadImage()
{
//此JS是为了刷心验证码图片,src同样是以上login.jsp写的路径,rnd是JS内置函数Math.random()
//生成的一个随机数,这个必须要写,如果不写不能达到刷新的效果,原因是 必须跟随一个变量,
//不能是恒量,您也可以采取系统当前时间,只要保证每次点击图片保证发生变化即可
this.src ="pages/common/image.jsp?rnd="+Math.random();
}
UserAction.java
//如何判断验证码是否正确,只要下面俩句话
//rand即为图片验证上面的数字,code是login.jsp 中from用户输入的验证码文本框的值
String rand = request.getSession().getAttribute("rand").toString();
String code = request.getParameter("code");
//只需判断此二值即可
if (code.equals(rand)) {
System.out.println("一致");
}else
{
System.out.println("不一致");
//这个仅仅为了让您看个结果,您可以根据自己的业务逻辑进行下一步操作,
//如继续判断用户名密码是否都符合条件,执行 登录操作
}
ps: 在您把这些贴到您的项目时,可能需要稍微调调,上面的// 就是为了让您明白那是我给你的注释,你把//即后面的注解可以都删掉即可,希望对您有帮助,祝君学习成功。