今天在调试项目的时候发现，在提交表单的时候的验证码有问题，问题是这样的：就是通过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:

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

  1.  

2.Web.xml文件：

  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>
  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：

  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. <body>
  62. <form onsubmit="return validate();" action="" method="post">
  63. <h3>jsp+js+servlet实现验证码</h3>
  64. <br /> 用户名：<input type="text" name="" /><br /> 请输入验证码： <input
  65. type="text" id="vcode" style="width: 60;" maxLength="5" /> <img
  66. src="" id="code" /> <a href="#" mce_href="#"
  67. onclick="javascript:show();return false;">看不清,换一张!</a><br /> <input
  68. type="submit" />
  69. </form>
  70. </body>
  71. </html>
  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="width: 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>

jsp中生成的验证码和存在session里面的验证码不一致的处理的更多相关文章

  1. jsp中生成txt文件

    import jxl.Workbook; import jxl.write.Label; import jxl.write.WritableSheet; import jxl.write.Writab ...

  2. JAVA WEB项目中生成验证码及验证实例（附源码及目录结构）

    [我是一个初学者,自己总结和网上搜索资料,代码是自己敲了一遍,亲测有效,现将所有的目录结构和代码贴出来分享给像我一样的初学者] 作用 验证码为全自动区分计算机和人类的图灵测试的缩写,是一种区分用户是计 ...

  3. java中生成验证码，以及验证码的使用

    java中生成验证码,以及验证码的使用: 1:验证码生成工具类: import java.awt.Color; import java.awt.Font; import java.awt.Graphi ...

  4. servlet中生成验证码

    在servlet中生成验证码 package login; import java.awt.Color; import java.awt.Graphics; import java.awt.image ...

  5. 2017.11.27 用Servlet在JSP中加入验证码

    登陆界面 <%@ page pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...

  6. Django中生成随机验证码(pillow模块的使用)

    Django中生成随机验证码 1.html中a标签的设置 <img src="/get_validcode_img/" alt=""> 2.view ...

  7. 对JSP中的Session 简单理解

    我的理解: 简单来说,要使用服务器端的session对象,就是要有其对应的key,即sessionid,它只认识sessionid. 下面我说的cookie,url重写或者隐藏表单,都是为了将其对应的 ...

  8. 在ashx文件中制作验证码（使用session要继承IRequiresSessionState）

    必须继承System.Web.SessionState.IRequiresSessionState接口,才能实现Session读写! System.Web.SessionState的一些接口 IRea ...

  9. JSP中Session的使用

    JSP session使用方法 <%@page contentType="text/html;charset=GB2312"%><html>  <he ...

随机推荐

  1. thinkphp 数据写入

    直线电机优势 ThinkPHP的数据写入操作使用add方法,使用示例如下: $User = M("User"); // 实例化User对象 $data['name'] = 'Thi ...

  2. 莫烦PyTorch学习笔记(六)——批处理

    1.要点 Torch 中提供了一种帮你整理你的数据结构的好东西, 叫做 DataLoader, 我们能用它来包装自己的数据, 进行批训练. 而且批训练可以有很多种途径. 2.DataLoader Da ...

  3. 聊聊MVC和模块化以及MVVM和组件化

    原文链接 小寒的博客,带你理解更深的世界 面向对象,模块化和MVC 面向对象是指把写程序映射到现实生活,从而一来逻辑性更强,更容易写好代码,二来代码很贴切,通俗易懂,更被人理解,三来更加容易拓展和管理 ...

  4. Python高质量缩放切图,抗锯齿

    最近刚接触Python,以迅雷不及掩耳盗铃之势(只是迫不及待)应用到工作中去了之前用 cmd+photoshop做批量图像处理(缩放切片),在执行效率(速度)上和灵活度上有很大限制,遂转战Python ...

  5. Jeecg-Boot 2.0.1 版本发布，前后端分离快速开发平台

    Jeecg-Boot项目简介 Jeecg-boot 是一款基于代码生成器的快速开发平台! 采用前后端分离技术:SpringBoot,Mybatis,Shiro,JWT,Vue & Ant De ...

  6. PAT甲级——A1098 Insertion or Heap Sort

    According to Wikipedia: Insertion sort iterates, consuming one input element each repetition, and gr ...

  7. GC 案例收集整理

    1.数组动态扩容  现象:系统一直在做cms gc,但是老生代一直不降下去,但是执行一次jmap -histo:live之后,也就是主动触发一次full gc之后,通过jstat -gcutil来看老 ...

  8. 1、Zookeeper的功能以及工作原理

    1.ZooKeeper是什么? ZooKeeper是一个分布式的,开放源码的分布式应用程序协调服务,是Google的Chubby一个开源的实现,它是集群的管理者,监视着集群中各个节点的状态根据节点提交 ...

  9. css 渐变背景

    background: linear-gradient(left,#fa7f6d, #fc5e7f); left: 从左边开始

  10. NoSQL与关系数据库的比较