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         else15         {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     }

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

代碼全部完成

結果如***

 

jsp使用servlet實現驗證碼