驗證碼實現原理

最近對前端註冊和登陸的驗證碼感興趣,研究了一下;

開始研究時候主要有如下幾個問題;

1,前端的驗證碼圖片是怎麼生成的(jQuery/js前端直接生成仍是經過java,swing繪圖而刷到前端的)

2,若是是jQuery的話,生成了驗證碼圖片,是怎麼把這個生成的字符刷到後臺,而進行驗證的;

3,若是是java swing 繪圖生成圖片,是怎麼把這個圖片刷到前端的,後端又是怎麼判斷的;

 

帶着這幾個問題開始了研究:

1:首先是利用java swing的繪圖工具在服務端繪圖輸出的工做原理:

前端設置一個img標籤,綁定一個onclick事件,圖片的src地址(第一次加載的時候就會顯示),是項目名加這個servlet,也就是說當點擊事件發生後servlet收到請求,並把繪製的圖片響應出去,固然onclick事件裏面的函數也是一個一樣一個src,每次點擊則從新加載一次src,須要注意的是:瀏覽器會斷定是否重複提交連接,若是重複提交的話,則不發出請求,因此,要在後面加上一個每次都會變的值(獲取當前事件,或者用math的random方法生成一個隨機數),來激發servlet的每次校驗運行,這樣的一個小技巧可以實現局部刷新;

服務端的變化是:經過java swing一個servlet生成一個圖片,誰請求這個servlet,就利用此servlet裏面的響應函數,把圖片響應出去,響應的前端則是一個利用一個img標籤的src連接請求到這個servlet;請求收到後,則經過字節輸出流輸出到前端的img標籤,瀏覽器在響應的img標籤的位置解析到圖片,則一次請求響應完成;

這個方式是增長了服務器的壓力,但安全性高,把生成的驗證碼能夠存到session會話裏面進行驗證

 

2:利用jQuery方式自動生成驗證碼,把驗證碼請求到後臺的方式;

jQuery:驗證碼一套功能包主要包括:

a.點擊圖片,局部刷新

b.失去焦點驗證:是否爲空都給出響應的提示

c.前端驗證碼進行校驗,成功則能夠進行提交,失敗則不能提交

固然咱們研究的核心是怎麼對這種blackbox,放到咱們想用他們的地方;

是用img標籤進行繪圖顯示嗎,點擊刷新綁定onclick事件的話怎麼把這兩個事件綁定到一塊兒?

 

 

這種方式雖然服務器壓力小了,可是相對於服務器校驗安全性較低,能夠進行模擬瀏覽器進行誘騙提交(繞過前端驗證,直接對相應的服務層進行數據提交),進行暴力密碼破解;因此用這種方式進行校驗的話,最好在服務器端進行帳號登陸錯誤次數限制,更改密碼後當日恢復登陸限制;