zoukankan      html  css  js  c++  java

  • jsp中生成的验证码和存在session里面的验证码不一致的处理

    今天在调试项目的时候发现，在提交表单的时候的验证码有问题，问题是这样的：就是通过debug模式查看得知：jsp页面生成的验证码和表单输入的页面输入的一样，但是到后台执行的时候，你会发现他们是不一样的，现在上图看看：

    1.这是表单提交的时候:


    2.这是后台得到的生成的验证码：



    3.这是后台得到输入的验证码：



    这样的问题还是头一次出现，以前没遇到过，经过google，baidu，最后得知是这样的：因为加载jsp页面比加载session快一些


    那怎么办才能解决这个办法呢，

    又经过多次搜索，思考，实践，终于想出了个好办法

    1.在jsp页面用js生成验证码并保存在变量中，验证码作为参数传到java(继承了HttpServlet)类


    2.根据jsp页面中传过来的验证码画出一个有干扰线或干扰点的图片

     

    3.在WEB-INF/web.xml中配置 servlet

     

    4.在jsp页面调用配置好的servlet，一般是通过<img src="servlet名" id="code"/>调用

     

    5.提交数据之前验证

    <form onsubmit="return validate();"……/>


    局部刷新验证码：<a href="#" onclick="javascript:show();return false;">看不清,换一张！</a>-----return false;很重要啊

    下面直接附上我的例子：

    截图如下：



    代码如下：

    1.JAVA类：CodeServlet.java:

    [java] view plain copy
     print?
    1. package cn.gov.csrc.servlet;  
    2.   
    3. import java.awt.Color;  
    4. import java.awt.Font;  
    5. import java.awt.Graphics;  
    6. import java.awt.image.BufferedImage;  
    7. import java.io.IOException;  
    8. import java.util.Random;  
    9.   
    10. import javax.servlet.ServletException;  
    11. import javax.servlet.http.HttpServlet;  
    12. import javax.servlet.http.HttpServletRequest;  
    13. import javax.servlet.http.HttpServletResponse;  
    14.   
    15. import com.sun.image.codec.jpeg.JPEGCodec;  
    16. import com.sun.image.codec.jpeg.JPEGImageEncoder;  
    17.   
    18. public class CodeServlet extends HttpServlet {  
    19.   
    20.     /** 
    21.      * 产生验证码图片 
    22.      */  
    23.     public void doGet(HttpServletRequest request, HttpServletResponse response)  
    24.             throws ServletException, IOException {  
    25.         response.setContentType("image/jpeg");  
    26.         response.setHeader("Cache-Control", "no-cache");  
    27.         response.setHeader("Pragma", "No-cache");  
    28.         response.setDateHeader("Expires", 0L);  
    29.         int width = 80;  
    30.         int height = 30;  
    31.         BufferedImage image = new BufferedImage(width, height, 1);  
    32.         Graphics g = image.getGraphics();  
    33.         Random random = new Random();  
    34.         g.setColor(getRandColor(200, 250));  
    35.         g.fillRect(0, 0, width, height);  
    36.         g.setFont(new Font("Arial", 0, 25));  
    37.         g.setColor(getRandColor(160, 200));  
    38.         for (int i = 0; i < 155; i++) {  
    39.             int x = random.nextInt(width + 100);  
    40.             int y = random.nextInt(height + 100);  
    41.             int xl = random.nextInt(10);  
    42.             int yl = random.nextInt(12);  
    43.             g.drawOval(x, y, x + xl, y + yl);  
    44.         }  
    45.         String code = request.getParameter("code");  
    46.         String sRand = code;  
    47.         for (int i = 0; i < sRand.length(); i++) {  
    48.             String rand = sRand.substring(i, i + 1);  
    49.             g.setColor(new Color(20 + random.nextInt(110), 20 + random  
    50.                     .nextInt(110), 20 + random.nextInt(110)));  
    51.             g.drawString(rand, 14 * i + 5, 25);  
    52.         }  
    53.         g.dispose();  
    54.         javax.servlet.ServletOutputStream imageOut = response.getOutputStream();  
    55.         JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(imageOut);  
    56.         encoder.encode(image);  
    57.     }  
    58.   
    59.     private Color getRandColor(int fc, int bc) {  
    60.         Random random = new Random();  
    61.         if (fc > 255)  
    62.             fc = 255;  
    63.         if (bc > 255)  
    64.             bc = 255;  
    65.         int r = fc + random.nextInt(bc - fc);  
    66.         int g = fc + random.nextInt(bc - fc);  
    67.         int b = fc + random.nextInt(bc - fc);  
    68.         return new Color(r, g, b);  
    69.     }  
    70.   
    71. }  


    
2.Web.xml文件：

    

    

    [html] view plain copy
     print?
    1. <?xml version="1.0" encoding="UTF-8"?>  
    2. <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"  
    3.     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
    4.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee   
    5.     http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">  
    6.     <display-name></display-name>  
    7.     <welcome-file-list>  
    8.         <welcome-file>index.jsp</welcome-file>  
    9.     </welcome-file-list>  
    10.     <servlet>  
    11.         <servlet-name>CodeServlet</servlet-name>  
    12.         <servlet-class>cn.gov.csrc.servlet.CodeServlet</servlet-class>  
    13.     </servlet>  
    14.     <servlet-mapping>  
    15.         <servlet-name>CodeServlet</servlet-name>  
    16.         <url-pattern>/CodeServlet</url-pattern>  
    17.     </servlet-mapping>  
    18. </web-app>  

    
3.index.jsp：

    

    

    [javascript] view plain copy
     print?
    1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
    2. <%  
    3.     String path = request.getContextPath();  
    4.     String basePath = request.getScheme() + "://"  
    5.             + request.getServerName() + ":" + request.getServerPort()  
    6.             + path + "/";  
    7. %>  
    8. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
    9. <html>  
    10. <head>  
    11. <base href="<%=basePath%>">  
    12. <title>验证码测试</title>  
    13. <meta http-equiv="pragma" content="no-cache">  
    14. <meta http-equiv="cache-control" content="no-cache">  
    15. <meta http-equiv="expires" content="0">  
    16. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
    17. <meta http-equiv="description" content="This is my page">  
    18. <script language="javascript" type="text/javascript">  
    19. var code ; //在全局 定义验证码   
    20. function createCode(){    
    21.     code = "";    
    22.     var codeLength = 5;//验证码的长度    
    23.     //所有候选组成验证码的字符，可以用中文    
    24.     var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C',  
    25.             'D','E','F','G','H','I','J','K','L','M','N','O','P',  
    26.             'Q','R','S','T','U','V','W','X','Y','Z','a','b','c',  
    27.             'd','e','f','g','h','i','j','k','l','m','n','o','p',  
    28.             'q','r','s','t','u','v','w','x','y','z');    
    29.     for(var i=0;i<codeLength;i++){    
    30.         var charIndex = Math.floor(Math.random()*60);    
    31.         code +=selectChar[charIndex];    
    32.     }    
    33.     return code;    
    34. }    
    35. function validate (){    
    36.     var inputCode = document.getElementById("vcode").value.toLowerCase();    
    37.     if(inputCode.length <=0){    
    38.         alert("请输入验证码！");    
    39.         return false;    
    40.     }    
    41.     else if(inputCode != code.toLowerCase()){    
    42.         alert("验证码输入错误！");    
    43.         show();//刷新验证码    
    44.         return false;    
    45.     }else{    
    46.         alert("^-^ OK");    
    47.         return true;    
    48.     }    
    49. }    
    50. function show(){    
    51.         //显示验证码    
    52.         document.getElementById("code").src="CodeServlet?code="+createCode();    
    53. }    
    54. window.onload = function() {  
    55.         //document.onload=show();    
    56.         show();//页面加载时加载验证码    
    57.         //这时无论在ie还是在firefox中，js没有加载完，页面的东西是不会被执行的；    
    58.     }    
    59. </script>  
    60. </head>  
    61.   
    62. <body>  
    63.     <form onsubmit="return validate();" action="" method="post">  
    64.         <h3>jsp+js+servlet实现验证码</h3>  
    65.         <br /> 用户名：<input type="text" name="" /><br /> 请输入验证码： <input  
    66.             type="text" id="vcode" style=" 60;" maxLength="5" /> <img  
    67.             src="" id="code" /> <a href="#" mce_href="#"  
    68.             onclick="javascript:show();return false;">看不清,换一张!</a><br /> <input  
    69.             type="submit" />  
    70.     </form>  
    71. </body>  
    72. </html>  


    


    


    
                
    
                    
    

    
    
                
    
                
              
    • 
              
    
              
  • 

                相关阅读:
    
                
                  owe的用法
                    
    other,others,another,the other的区别
                    
    国内顶尖的sql dba 团队招人。
                    
    Sqler 工具更新
                    
    2015 年个人计划
                    
    在没Hadoop 、GP 前提下怎么进行实时数据统计。
                    
    201407-至今
                    
    Sqler-Cmd
                    
    Sqler-Monitor
                    
    SqlCmd -Windows Cluster Model
                    
                        
              
    • 
              
    
              
  • 
                原文地址：https://www.cnblogs.com/jpfss/p/8444654.html
              
    • 

            

          



          
          

            

            

          

        

      

      



      

      

        

          Copyright © 2011-2022 走看看