jsp使用servlet實現驗證碼

在進行表單設計中，驗證碼的增長偏偏能夠實現是否爲「人爲」操做，增長驗證碼能夠防止網站數據庫信息的冗雜等...

如今，小編將講述經過servlet實現驗證碼：

驗證碼做爲一個圖片，在頁面中爲「畫」出來的，它是如何畫出來的呢？

<生成圖片>

{

　　生成圖片的類：

　　1.BufferedImage圖像數據緩衝區

　　2.Graphics繪製圖片

　　3.color獲取顏色

　　4.Random獲取隨機數

　　5.ImageIO輸出圖片

}

///////////////////////////////////////////////////////////////////////////

<生成驗證碼圖片>

1.在index.jsp中寫入如下代碼

  <form action="<%= request.getContextPath()%>/servlet/LoginServlet" method="get" >
    驗證碼:<input  type="text" name="checkCode"/>
    <img alt="驗證碼" id="imagecode" src="<%= request.getContextPath()%>/servlet/ImageServlet"/>
    <a href="javascript:reloadCode();">看不清楚</a><br>
    <input type="submit" value="提交">
    </form>

2.在src中建立ImageServlet類

 1 public class ImageServlet  extends HttpServlet{
 2     public void doGet(HttpServletRequest request,HttpServletResponse response) throws IOException{
 3         //這個方法實現驗證碼的生成
 4         BufferedImage bi=new BufferedImage(68, 22,BufferedImage.TYPE_INT_RGB);//建立圖像緩衝區
 5          Graphics g=bi.getGraphics(); //經過緩衝區建立一個畫布
 6          Color c=new Color(200,150,255); //建立顏色
 7          /*根據背景畫了一個矩形框
 8           */
 9          g.setColor(c);//爲畫布建立背景顏色
10          g.fillRect(0, 0, 68,22); //fillRect:填充指定的矩形
11          
12          char[] ch="ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789".toCharArray();//轉化爲字符型的數組
13          Random r=new Random();
14          int len=ch.length;
15          int index; //index用於存放隨機數字
16          StringBuffer sb=new StringBuffer();
17          for(int i=0;i<4;i++)
18          {
19              index=r.nextInt(len);//產生隨機數字
20              g.setColor(new Color(r.nextInt(88),r.nextInt(188),r.nextInt(255)));  //設置顏色
21              g.drawString(ch[index]+"",(i*15)+3, 18);//畫數字以及數字的位置
22              sb.append(ch[index]);
23          }
24          request.getSession().setAttribute("piccode",sb.toString()); //將數字保留在session中，便於後續的使用
25          ImageIO.write(bi, "JPG", response.getOutputStream()); 
26     }

3.在WEB-INF進行配置文件

1 <servlet>
2         <servlet-name>ImageServlet</servlet-name>
3         <servlet-class>code.sam.ImageServlet</servlet-class>
4 </servlet>
5 
6 <servlet-mapping>
7         <servlet-name>ImageServlet</servlet-name>
8         <url-pattern>/servlet/ImageServlet</url-pattern>
9 </servlet-mapping>

------華麗分割線-------

<輸入信息與圖片中的數字進行校驗>

1.建立LoginServlet類

 1 public class LoginServlet extends HttpServlet {
 2     public void doGet(HttpServletRequest request,HttpServletResponse response) throws IOException
 3     //用於驗證驗證碼
 4     {
 5         String piccode=(String) request.getSession().getAttribute("piccode");
 6         String checkCode=request.getParameter("checkCode");  //取值
 7         //checkCode=checkCode.toUpperCase();  //把字符所有轉換爲大寫的（此語句能夠用於驗證碼不區分大小寫）
 8         response.setContentType("text/html;charset=gbk");//解決亂碼問題
 9         PrintWriter out=response.getWriter();
10         if(checkCode.equals(piccode))
11         {
12             out.println("驗證碼輸入正確！");
13         }
14         else
15         {
16             out.println("驗證碼輸入錯誤！！！");
17         }
18         out.flush();//將流刷新
19         out.close();//將流關閉
20     }

2.配置WEB-INF

1     <servlet>
2         <servlet-name>LoginServlet</servlet-name>
3         <servlet-class>code.sam.LoginServlet</servlet-class>
4     </servlet>
5 
6     <servlet-mapping>
7         <servlet-name>LoginServlet</servlet-name>
8         <url-pattern>/servlet/LoginServlet</url-pattern>
9     </servlet-mapping>

------華麗分割線-----

在點擊頁面中的看不清楚時，須要進行刷新，在頁面中書寫一段JS代碼

1     function reloadCode()
2     {
3         var time=new Date().getTime();
4         document.getElementById("imagecode").src="<%= request.getContextPath()%>/servlet/ImageServlet?d="+time;
5     }

****************************************************

代碼所有完成

結果以下圖***