java 后端 验证码逻辑_Java后端产生验证码后台验证功能的实现代码

这篇博客介绍了如何在Java后端生成验证码并进行后台验证。通过Servlet创建验证码图片,利用Graphics2D绘制干扰线和随机数字,然后将验证码保存到Session中。前端通过点击事件刷新验证码,并使用Ajax获取新的验证码值进行比对,实现验证码的验证功能。同时,还探讨了另一种仅由后端生成随机数、前端绘制验证码图片的方案。
摘要由CSDN通过智能技术生成

直接跳severlet在java后台生成验证码:

@RequestMapping(value="yzm.action")

public void Yzm(HttpSession session,HttpServletResponse resp){

// 验证码图片的宽度。

int width = 60;

// 验证码图片的高度。

int height = 20;

// 验证码字符个数

int codeCount = 4;

int x = 0;

// 字体高度

int fontHeight;

int codeY;

char[] codeSequence = { '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', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' };

x = width / (codeCount + 1);

fontHeight = height - 2;

codeY = height - 4;

BufferedImage buffImg = new BufferedImage(width, height,

BufferedImage.TYPE_INT_RGB);

Graphics2D g = buffImg.createGraphics();

// 创建一个随机数生成器类

Random random = new Random();

// 将图像填充为白色

g.setColor(Color.WHITE);

g.fillRect(0, 0, width, height);

// 创建字体,字体的大小应该根据图片的高度来定。

Font font = new Font("Fixedsys", Font.PLAIN, fontHeight);

// 设置字体。

g.setFont(font);

// 画边框。

// g.setColor(Color.BLACK);

// g.drawRect(0, 0, width - 1, height - 1);

// 随机产生160条干扰线,使图象中的认证码不易被其它程序探测到。

g.setColor(Color.BLACK);

for (int i = 0; i < 1; i++) {

int x2 = random.nextInt(width);

int y2 = random.nextInt(height);

int xl = random.nextInt(12);

int yl = random.nextInt(12);

g.drawLine(x2, y2, x + xl, y2 + yl);

}

// randomCode用于保存随机产生的验证码,以便用户登录后进行验证。

StringBuffer randomCode = new StringBuffer();

int red = 0, green = 0, blue = 0;

// 随机产生codeCount数字的验证码。

for (int i = 0; i < codeCount; i++) {

// 得到随机产生的验证码数字。

String strRand = String.valueOf(codeSequence[random.nextInt(36)]);

// 产生随机的颜色分量来构造颜色值,这样输出的每位数字的颜色值都将不同。

red = random.nextInt(255);

green = random.nextInt(255);

blue = random.nextInt(255);

// 用随机产生的颜色将验证码绘制到图像中。

g.setColor(new Color(red, green, blue));

g.drawString(strRand, (i + 1) * x, codeY);

// 将产生的四个随机数组合在一起。

randomCode.append(strRand);

}

// 将四位数字的验证码保存到Session中。

session.setAttribute("validateCode", randomCode.toString());

ServletOutputStream sos;

try {

sos = resp.getOutputStream();

ImageIO.write(buffImg, "jpeg", sos);

sos.close();

} catch (IOException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

}

jsp显示页面的代码,点击图片刷新

yzm.action${validateCode}

$("#img").click(function(){

$(this).attr("src","yzm.action?"+new Date().getTime());

});

将文本框中的值传入后台,与最开始生成验证码的随机数进行比较即可完成验证。

f4dae28809d4b70fc0d3f574d3000614.png

页面上拿到的session的值老是比验证码晚一步,所以采取后台进行验证。这里我也不知道什么原因,望小伙伴们告知。。。

另一种思路,后台生成随机数,前端生成画布,用ajax拿随机数

//后台只生成随机数

@RequestMapping(value="random.action")

public void findRandom (HttpServletResponse response) throws IOException{

// 验证码字符个数

int codeCount = 4;

char[] codeSequence = { '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', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' };

// 创建一个随机数生成器类

Random random = new Random();

// randomCode用于保存随机产生的验证码,以便用户登录后进行验证。

StringBuffer randomCode = new StringBuffer();

for (int i = 0; i < codeCount; i++) {

// 得到随机产生的验证码数字。

String strRand = String.valueOf(codeSequence[random.nextInt(36)]);

// 将产生的四个随机数组合在一起。

randomCode.append(strRand);

}

PrintWriter out = response.getWriter();

out.print(randomCode);

}

jsp,jq,js代码

换一张

$.ajax({

url:"random.action",

success:function(k){

console.log(k)

$("#yzms").attr("value",k);

drawPic();

}

})

$("#img").on("click",function(){

var _this=$(this)

$.ajax({

url:"random.action",

success:function(k){

console.log(k)

$("#yzms").attr("value",k);

drawPic();

}

})

})

/**生成一个随机数**/

function randomNum(min,max){

return Math.floor( Math.random()*(max-min)+min);

}

/**生成一个随机色**/

function randomColor(min,max){

var r = randomNum(min,max);

var g = randomNum(min,max);

var b = randomNum(min,max);

return "rgb("+r+","+g+","+b+")";

}

/**绘制验证码图片**/

function drawPic(){

var canvas=document.getElementById("canvas");

var width=canvas.width;

var height=canvas.height;

var ctx = canvas.getContext('2d');

ctx.textBaseline = 'bottom';

/**绘制背景色**/

ctx.fillStyle = randomColor(180,240); //颜色若太深可能导致看不清

ctx.fillRect(0,0,width,height);

/**绘制文字**/

/* for(var i=0; i<4; i++){ */

var txt = $("#yzms").attr("value");

ctx.fillStyle = randomColor(50,160); //随机生成字体颜色

ctx.font = randomNum(15,20)+'px SimHei'; //随机生成字体大小

var x = 20;

var y = randomNum(20,30);

var deg = randomNum(-45, 45);

//修改坐标原点和旋转角度

ctx.translate(x,y);

ctx.rotate(deg*Math.PI/180);

ctx.fillText(txt, 0,0);

//恢复坐标原点和旋转角度

ctx.rotate(-deg*Math.PI/180);

ctx.translate(-x,-y);

/* } */

/* /**绘制干扰线**/

for(var i=0; i<8; i++){

ctx.strokeStyle = randomColor(40,180);

ctx.beginPath();

ctx.moveTo( randomNum(0,width), randomNum(0,height) );

ctx.lineTo( randomNum(0,width), randomNum(0,height) );

ctx.stroke();

}

/**绘制干扰点**/

/* for(var i=0; i<100; i++){

ctx.fillStyle = randomColor(0,255);

ctx.beginPath();

ctx.arc(randomNum(0,width),randomNum(0,height), 1, 0, 2*Math.PI);

ctx.fill();

} */

}

效果展示:

8e44de6d782683bcd230bc33b7c2bfba.png

总结

以上所述是小编给大家介绍的Java后端产生验证码后台验证功能的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对谷谷点程序网站的支持!

如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值