var code //在全局定义验证码
//产生验证码
window.onload = function createCode(){
code = ""
var codeLength = 4//验证码的长度
var checkCode = document.getElementById("code")
var random = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R',
'S','T','U','V','W','X','Y','Z')//随机数
for(var i = 0i <codeLengthi++) {//循环操作
var index = Math.floor(Math.random()*36)//取得随机数的索引(0~35)
code += random[index]//根据索引取得随机数加到code上
}
checkCode.value = code//把code值赋给验证码
}
//校验验证码
function validate(){
var inputCode = document.getElementById("input").value.toUpperCase()//取得输入的验证码并转化为大写
if(inputCode.length <= 0) { //若输入的验证码长度为0
alert("请输入验证码!")//则弹出请输入验证码
}
else if(inputCode != code ) { //若输入的验证码与产生的验证码不一致时
alert("验证码输入错误!@_@")//则弹出验证码输入错误
createCode()//刷新验证码
document.getElementById("input").value = ""//清空文本框
}
else { //输入正确时
alert("^-^")//弹出^-^
}
}
(1)jsp代码:<img id = "img_authcode" src="${ctx}/account/authcode" /><a href="javascript:" onclick="javascript:document.getElementById('img_authcode').setAttribute('src', '${ctx}/account/authcode?' + Math.random())">换一换</a>
(2)java代码(该代码为我自己框架代码,跟servlet写法不一样的我都给你注释了):
public View authcode() throws IOException {
HttpServletResponse response = PuffContext.getResponse()//获取response
response.setContentType("image/jpeg")
response.setHeader("Pragma", "No-cache")
response.setHeader("Cache-Control", "no-cache")
response.setDateHeader("Expires", 0)
String authCode = AuthCodeUtil.getRandom(4)//获取验证码,代码在下面(3)
System.out.println("生成随机码:" + authCode)
PuffContext.getSession().setAttribute("session_authcode", authCode)//把该验证码存储在session
ServletOutputStream output = response.getOutputStream()
AuthCodeUtil.draw(output, authCode)
output.flush()
output.close()
return ViewFactory.nullView()//返回null
}
(3)///////////////////////////下面为生成验证码类////////////////////////////////////
public class AuthCodeUtil {
private final static Random random = new Random()
// 随机字体样式
private final static int[] fontStyle = { Font.HANGING_BASELINE, Font.ITALIC, Font.LAYOUT_LEFT_TO_RIGHT, Font.LAYOUT_NO_LIMIT_CONTEXT,
Font.LAYOUT_NO_START_CONTEXT, Font.LAYOUT_RIGHT_TO_LEFT }
/**
* 画随机码图
*
* @param out
* @param width
* @param height
* @throws IOException
*/
public static void draw(OutputStream out, String value) throws IOException {
int width = 80, height = 30
BufferedImage bi = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB)
Graphics2D g = (Graphics2D) bi.getGraphics()
g.setColor(Color.WHITE)
g.fillRect(0, 0, width, height)
g.drawRect(1, 1, width - 2, height - 2)
for (int i = 0i <10i++) {
g.setColor(randColor(150, 250))
g.drawOval(random.nextInt(110), random.nextInt(24), 5 + random.nextInt(10), 5 + random.nextInt(10))
}
int n = (int) (Math.random() * 6)
Font mFont = new Font("Arial", fontStyle[n], 23)
g.setFont(mFont)
g.setColor(randColor(10, 240))
g.drawString(value, 10, 21)// 随机数,水平距离,垂直距离
ImageIO.write(bi, "png", out)
}
private static Color randColor(int fc, int bc) {// 给定范围获得随机颜色
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)
}
public static void main(String[] args) throws IOException {
FileOutputStream out = new FileOutputStream("d:\\aa.png")
draw(out, getRandom(4))
}
public static String getRandom(int size) {// 随机字符串
char[] c = { '1', '3', '5', '6', '7', '8', '9' }
StringBuffer sb = new StringBuffer()
for (int i = 0i <sizei++)
sb.append(c[Math.abs(random.nextInt()) % c.length])
return sb.toString()
}
}