Servlet程序中玩验证码

验证码思想：所谓验证码就是产生若干随机数，存放到session中，然后在servlet中获取session中的该值与页面输入值相比较，进而判断正误。

 

产生验证码的方法：

随机数放在图片中，封装为一个JSP文件，并且将产生的验证码存放到session中。

 

刷新验证码的方法：

方法一：点击验证码图片刷新：

验证码封装在JSP文件里，在表单中以图片的方式引入，代码如下：

<img id= "rightcode" src ="number.jsp" style=" cursor: pointer; vertical-align :middle;" onclick="javascript:this.src='number.jsp?'+Math.random()*10000;" />

点击换一张验证码，本质就是将验证码的src刷新一下，上一行代码中通过点击事件来刷新src.

方法二：可以在验证码后面加链接文字，通过JS实现点击刷新验证码的src。

如：

<script language= "JAVASCRIPT">

      /*点击换一张验证码，本质就是将验证码的src刷新一下*/

     function cg(){                                       

          document.getElementById( "rightcode" ).src = 'number2.jsp?' +Math.random()*10000;

     }

</ script>

<a href= "javascript:cg();">换一张 </a>

 

 

 

 

产生版本一验证码文件number.jsp代码如下：

<%@ page contentType= "image/jpeg" language ="java"

import="java.util.*,java.awt.*,java.awt.image.*,javax.imageio.*" pageEncoding= "utf-8"%>  

<%! 

    Color getRandColor( int fc,int bc){ 

        Random random = new Random(); 

        if(fc > 255){ 

            fc = 255; 

        } 

        if(bc < 255){ 

            bc = 255; 

        } 

        int r = fc +random.nextInt(bc-fc); 

        int g = fc +random.nextInt(bc-fc); 

        int b = fc +random.nextInt(bc-fc);          

        return new Color(r,g,b); 

    } 

%> 

 

<%  

    //设置页面不缓存 

    response.setHeader( "Pragma","no-cache" ); 

    response.setHeader( "Cache-Control","no-catch" ); 

    response.setDateHeader( "Expires",0); 

     

    //在内存中创建图象 

    int width = 60; 

    int height = 20; 

    BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB); 

     

    //创建图象 

    Graphics g = image.getGraphics(); 

    //生成随机对象 

    Random random = new Random(); 

    //设置背景色 

    g.setColor(getRandColor(200,250)); 

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

    //设置字体 

    g.setFont(new Font( "Tines Nev Roman",Font.PLAIN,18)); 

    //随机产生干扰线 

    g.setColor(getRandColor(160,200)); 

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

        int x = random.nextInt(width); 

        int y = random.nextInt(height); 

        int xl = random.nextInt(12); 

        int yl = random.nextInt(12); 

    } 

    //随机产生认证码,4位数字 

    String sRand = ""; 

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

        String rand = String.valueOf(random.nextInt(10)); 

        sRand  += rand; 

        //将认证码显示到图象中 

        g.setColor( new Color(20 + random.nextInt(110),20 + random.nextInt(110),20 + random.nextInt(110))); 

        g.drawString(rand,13*i+6,16); 

    } 

    /*把产生的验证码放到session中，在LoginServlet中获得该值与输入的验证码值进行比较*/

    session.setAttribute( "jpgCode",sRand); 

    //图像生效 

    g.dispose(); 

    //输出图像到页面 

    ImageIO.write(image,"JPEG" ,response.getOutputStream()); 

    out.clear(); 

    out = pageContext.pushBody(); 

%>

 

LoginServlet中获取值：

String incode = request.getParameter( "code");  

Object rightcode = request.getSession().getAttribute("jpgCode" );

进过比较二者的值是否一样，从而进行页面的跳转。 

 

 

产生版本二验证码文件number.jsp代码如下：

<%@ page language="java"  pageEncoding="UTF-8"   %>

<%@ page contentType= "image/jpeg" 

import="java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*" %>

<%!

    Color getRandColor( int fc, int bc) {//给定范围获得随机颜色

          Random random = new Random();

           if (fc > 255)

              fc = 255;

           if (bc > 255)

              bc = 255;

           int r = fc + random.nextInt(bc - fc);

           int g = fc + random.nextInt(bc - fc);

           int b = fc + random.nextInt(bc - fc);

           return new Color(r, g, b);

     }

%>

<%

     //设置页面不缓存

     response.setHeader( "Pragma", "No-cache" );

     response.setHeader( "Cache-Control", "no-cache" );

     response.setDateHeader( "Expires", 0);

 

     //生成随机验证码

     Random random = new Random();

     String sRand = "";

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

          String rand = String.valueOf(random.nextInt(10));

          sRand += rand;

     }

    /*把产生的验证码放到session中，在LoginServlet中获得该值与输入的验证码值进行比较*/

     session.setAttribute( "jpgCode", sRand);

 

     // 在内存中创建图象

     int width = 55;

     int height = 20;

     BufferedImage image = new BufferedImage(width, height,

              BufferedImage.TYPE_INT_RGB);

 

     // 获取图形上下文

     Graphics g = image.getGraphics();

 

     // 设定背景色

     g.setColor(getRandColor(200, 250));

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

 

     //设定字体

     g.setFont( new Font("serif" , Font.CENTER_BASELINE, 16));

 

     //画边框

     g.setColor( new Color(1));

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

 

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

     g.setColor(getRandColor(160, 200));

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

           int x = random.nextInt(width);

           int y = random.nextInt(height);

           int xl = random.nextInt(12);

           int yl = random.nextInt(12);

          g.drawLine(x, y, x + xl, y + yl);

     }

 

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

          String rand = sRand.substring(i, i + 1);

           // 将认证码显示到图象中

          g.setColor( new Color(20 + random.nextInt(110), 20 + random

                   .nextInt(110), 20 + random.nextInt(110)));

           //调用函数出来的颜色相同，可能是因为种子太接近，所以只能直接生成

          g.drawString(rand, 13 * i + 6, 16);

     }

 

     // 图象生效

     g.dispose();

 

     // 输出图象到页面

     try {

          ImageIO.write(image, "JPEG", response.getOutputStream());

     } catch (Exception e) {

     }

     out.clear();

     out = pageContext.pushBody();

%>

 

 

 

产生版本三验证码文件number.jsp代码同版本二：

在引用页面加刷新事件，可以点击刷新验证码。

部分代码如下：

<script language= "JAVASCRIPT">

      /*点击换一张验证码，本质就是将验证码的src刷新一下*/

     function cg(){                                       

          document.getElementById( "rightcode" ).src = 'number2.jsp?' +Math.random()*10000;

     }

</ script>

<div class= "field">

     <label>< span class ="red"> *</span>验证码 </label>

     <span>

         <input type= "text" name ="code" id="code" class="yzm">

         <img id= "rightcode" src="number.jsp" style=" cursor: pointer; vertical-align:middle ;" onclick="javascript:this.src='number.jsp?'+Math.random()*10000;" />

         <a href= "javascript:cg();">换一张 </a>

     </span>

</div>