驗證碼原理分析及實現
一、前言
最近學習實現了驗證碼,首先附圖效果如下:(
簡單說明:
分別提交正確、錯誤的驗證碼及對應效果
本文是圖文結合說明)
二、驗證碼的作用
驗證碼是目前大多網站所支援並使用於註冊登入的。就在於其作用能有效防止惡意登入註冊,驗證碼每次都不同,
這就可以排除,用其他病毒或者軟體自動申請使用者及自動登陸.有效防止這種問題。
三、原理及知識點分析
1.原理
驗證碼於伺服器端生成,傳送給客戶端,並以影象格式顯示。客戶端提交所顯示的驗證碼,客戶端接收並進行比較,若比對失敗則不能實現登入或註冊,反之成功後跳轉相應介面。
2.主要知識
伺服器端的相關實現,前端運用 HTML 5,CSS 3 ,(可空白留給美工實現,須有 HTML 基礎知識)。
主要是三部分:
(提交介面, 成功及失敗的) jsp
(後臺對應提交 jsp 驗證提交內容的) servlet (生成驗證碼的) servlet
XML 文件
四、驗證碼實現
1.所用軟體為 Myeclipse
新建專案,預設生成 index.jsp 新建成功及失敗 jsp(檔名自定義,但後臺使用其路徑時要對應即可)
注意:將 charset ,pageEncoding 設定為 utf-8 才能支援中文,否則亂碼,此處採用 post 方法處理 Form 表單提交資料
2. jsp 程式碼寫介面
提交介面jsp 程式碼及成功 jsp失敗 jsp
三個介面的程式碼分別如下:
(1).提交頁面主要程式碼:
(2).成功頁面主要程式碼,驗證碼輸入成功跳轉的介面,提示登入成功或驗證碼輸入正確
(3).失敗頁面主要程式碼
(
其中form 表單中 action="index" 的 index 不是當前 index.jsp 檔案,是對應
新建的檢測提交資料正誤的 servlet 名字可自定義,下面截圖所示:
此處是我的失誤,不用這個名字,就不必多解釋這一點,希望不會給各位帶來不必要的麻煩
)
3. servlet 檔案處理資料
新建 servlet 對應 img 的 src 路徑來源屬性值,此處命名為 ImageServlet (可自定義但要相互對應)
實現驗證碼的產生與顯示
程式碼如下:
新建 action 對應的路徑屬性值 servlet 命名為 index 實現驗證及相關處理
程式碼如下:
5.新建對應的 XML 文件,程式碼如下
所實現效果即本文開頭所示。
不足之處請見諒及指教,謝謝覽閱。