展示验证码(jsp页面)
首先,我们需要自己利用BufferedImage类去生成一张可以变换的验证码图片;
之后,我们就可以利用这样一串代码去将验证码里面的内容获取到:
这是一串测试代码:
OutputStream os=new FileOutputStream("e://a.jpg");//为存放验证码图片的地址
String CheckCode=checkCode.outputVerifyImage(100,50,os,4);//固定验证码图片的大小,以及确定出每次图片里面出现的字符个数
System.out.println(CheckCode);//输出测试一下上述条件是否成立
验证码图片在jsp的注册界面这样放置:
如果这样写的话,就会把验证码写死,不能够实现灵活变换,所以需要进行优化
优化之后:
将生成的验证码图片放在该servlet里面,实现刷新即变换图片------更加灵活一些
在成功写完一个验证码图片的程序(checkCode.java)之后,需要在checkServlet里面调用,将以下代码写在doGet方法里面:
ServletOutputStream os=resp.getOutputStream();
String checkCode=checkCode.outputVerifyCode(100,50,os,4);
这样就实现了点击刷新就能够更换验证码的目的了
接下来,就需要去实现点击右边的看不清就能够实现验证码图片的更换:
在分别为图片和看不清添加id的同时,再利用js实现随机更换,且不会出现同一个随机数而导致的缓存(这会导致图片无法继续更换)
<script>
document.getElementById("changImg").onclick=function(){
document.getElementById("checkCodeImg").src="/ttCookieLogin/checkServlet?"+new Date().getMilliseconds();
}
</script>
若是要为图片本身增加单击事件的话,大概代码是这样的:
<script>
document.getElementById("checkCodeImg").onclick=function(){
document.getElementById("checkCodeImg").src="/ttCookieLogin/checkServlet?"+new Date().getMilliseconds();
}
</script>
校验验证码(一存一取一比对)
将从jsp页面获取到的验证码存入session中(在checkServlet.java里面写入)
HttpSession session=req.getSession();
req.setAttribute("checkCode",checkCode);
然后在注册页面的后端得到session存储的验证码数据:
然后获得文本框里面的数据:
之后在注册成功之前进行比对:
这样就OK啦!
标签:checkCode,验证码,---,getElementById,Session,Cookie,document,os,图片 From: https://www.cnblogs.com/liuzijin/p/16839966.html