关于jsp开发验证码的实现

太过爱你忘了你带给我的痛 2022-03-22 02:52 148阅读 0赞

前言,今天要写的是jsp开发时,需要的验证码功能。

1,实现验证码有很多方式,现在还有插件可以使用,今天主要讲的是通过代码实现验证码的功能

2,开始

1)首先我们要在前端写好验证码显示的区域

  1. <div>
  2. 验证码:<img src="<%=request.getContextPath() %>/base2/validate" alt="验证码" id="image" />
  3. <a href="javascript:reload();"><label>换一张</label></a><br>
  4. <input type="text" name="yanzhengma" id="yanzhengma" class="form-control" placeholder="验证码(忽略大小写)" onblur="validateCode();" />
  5. <label id="spans"></label>
  6. </div>

2)然后我们需要写好JavaScript,我们需要用到它去获得验证码,以及刷新验证码功能

  1. <script type="text/javascript">
  2. //-----------------------这个函数主要用来刷新验证码------------------------------------
  3. function reload(){
  4. $("#image").attr('src','<%=request.getContextPath()%>/base2/validate?date='+new Date().getTime());
  5. $("#checkcode").val(""); // 将验证码清空
  6. }
  7. //------------------------这个函数用来校验验证码--------------------------
  8. function yanzhengma() {
  9. var spans=document.getElementById("spans");
  10. var texts=document.getElementById("yanzhengma").value;
  11. if(texts.length<=0){
  12. spans.innerHTML="请输入输入验证码";
  13. spans.style.background="red";
  14. return false;
  15. }else{
  16. $.ajax({
  17. Type:"POST",
  18. url:"base2/check",
  19. data:{"texts":texts},
  20. success:function (data) {
  21. var booleans=data.boo;
  22. if (booleans == "false") {
  23. spans.innerHTML = "验证码输入错误";
  24. spans.style.background = "red";
  25. reload(); //验证失败后需要更换验证码
  26. texts = ""; // 将验证码清空
  27. return false;
  28. } else {
  29. spans.innerHTML = "验证码输入正确";
  30. spans.style.background = "green";
  31. return true;
  32. }
  33. }
  34. });
  35. }
  36. }
  37. </script>

3)第三步当然就是制作验证码了,我使用的方式是用SpringMvc去访问的后台。当然你也直接可以用servlet

  1. @Controller
  2. @RequestMapping("/base2")
  3. public class codechange {
  4. @RequestMapping("/validate")
  5. private void validate(HttpServletRequest request, HttpServletResponse response) throws Exception{
  6. System.out.println("*********************验证码查询进来了*********************************");
  7. BufferedImage bfi = new BufferedImage(75, 35, BufferedImage.TYPE_INT_RGB);
  8. Graphics g = bfi.getGraphics();
  9. g.fillRect(0, 0, 75, 35);
  10. //验证码字符范围
  11. char[] ch = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789".toCharArray();
  12. Random r = new Random();
  13. int index;
  14. StringBuffer sb = new StringBuffer(); //保存字符串
  15. for (int i = 0; i < 4; i++) {
  16. index = r.nextInt(ch.length);
  17. g.setColor(new Color(r.nextInt(255), r.nextInt(255), r.nextInt(255)));
  18. Font font = new Font("宋体", 30, 30);
  19. g.setFont(font);
  20. g.drawString(ch[index] + "", (i * 20) + 2, 23);
  21. sb.append(ch[index]);
  22. }
  23. // 添加噪点
  24. /* int area = (int) (0.02 * 80 * 25);
  25. for (int i = 0; i < area; ++i) {
  26. int x = (int) (Math.random() * 80);
  27. int y = (int) (Math.random() * 25);
  28. bfi.setRGB(x, y, (int) (Math.random() * 255));
  29. }*/
  30. //设置验证码中的干扰线
  31. for (int i = 0; i < 6; i++) {
  32. //随机获取干扰线的起点和终点
  33. int xstart = (int) (Math.random() * 80);
  34. int ystart = (int) (Math.random() * 25);
  35. int xend = (int) (Math.random() * 80);
  36. int yend = (int) (Math.random() * 25);
  37. g.drawLine(xstart, ystart, xend, yend);
  38. }
  39. HttpSession session = request.getSession(); //保存到session
  40. session.setAttribute("verificationCode", sb.toString());
  41. ImageIO.write(bfi, "JPG", response.getOutputStream()); //写到输出流
  42. System.out.println("验证码制作完毕:"+sb.toString());
  43. }
  44. @RequestMapping("/check")
  45. @ResponseBody
  46. private Map check(HttpServletRequest request, HttpServletResponse response) throws Exception{
  47. System.out.println("*******************验证码校验开始***************");
  48. HttpSession session =request.getSession();
  49. String verificationCode = (String)session.getAttribute("verificationCode");
  50. System.out.println("**sesion中的验证码为****************"+verificationCode);
  51. String checkcode = request.getParameter("texts");
  52. System.out.println("**前端传来中的验证码为****************"+checkcode);
  53. Map map=new HashMap();
  54. if(checkcode.equalsIgnoreCase(verificationCode)){
  55. System.out.println("*******************验证码校验结束,相等****************");
  56. map.put("boo",new String("true"));
  57. System.out.println("map的值"+map.get("boo"));
  58. }else{
  59. System.out.println("*******************验证码校验结束,不相等****************");
  60. map.put("boo",new String("false"));
  61. }
  62. return map;
  63. }
  64. }

好了,验证码的制作就完成了。看一下效果图,把它直接加在登录页面就行了

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMjgwMTMwNjQw_size_16_color_FFFFFF_t_70

发表评论

表情:
评论列表 (有 0 条评论,148人围观)

还没有评论,来说两句吧...

相关阅读

    相关 jsp验证代码

    在开发中验证码是比较常用到有效防止这种问题对某一个特定注册用户用特定程序破解方式进行不断的登陆尝试的方式。 此演示程序 [包][Link 1]括三个文件: 1.logi

    相关 jsp使用servlet实现验证

    在进行表单设计中,验证码的增加恰恰可以实现是否为“人为”操作,增加验证码可以防止网站数据库信息的冗杂等... 现在,小编将讲述通过servlet实现验证码: 验证码作为一个