在網站的登入介面,通常有三個元素,賬號、密碼、圖形驗證碼,圖形驗證碼的作用是為了防止惡意分子搞事請,但是圖形驗證碼對正常使用者來說,卻是增加了使用者的互動成本,所以對圖形驗證碼設定如下策略:
策略
- 使用者首次開啟登入介面,圖形驗證碼不作為登入要素
- 當使用者累計輸入錯誤的賬號或密碼達到我們設定的閥值,就將圖形驗證碼顯示出來,作為登入的必輸項
- 在驗證碼已作為登入要素的情況下,即使使用者重新整理瀏覽器,也還是需要輸入驗證碼
- 若使用者換一個瀏覽器或者清空快取,因為沒有了前端快取,所以不需要驗證碼,但伺服器快取仍在,所以還是取到放刷的目的
該策略保證了正常使用者的登入體驗,同時也防止惡意分子惡意操作
實現
實現邏輯:每當使用者登入失敗,就在快取中記錄失敗的次數,當次數達到了閥值,則告訴前端,將驗證碼顯示出來,並設定cookie,避免使用者重新整理瀏覽器後驗證碼消失,若使用者成功登入,則將前後端的對應快取都清掉。
流程圖
大致流程圖如下,(因為沒有安裝visio,迷之畫圖將就一下)
步驟解釋
- 使用者開啟瀏覽器
- 先查詢cookie中是否有顯示驗證碼的標識,
showImageCode
- 根據
showImageCode
,來顯示或隱藏驗證碼 - 使用者發起登入操作(後續步驟均為登入失敗的情況)
- 查詢快取中
loginErrTimes
是否存在,若不存在,新建一個,並設值為1
,若已存在,則加1
- 比較快取中
loginErrTimes
的值,是否大於設計的閥值,若已超過,則介面返回對應標識 - 根據介面返回的,決定是否顯示圖形驗證碼
- 當介面返回需要顯示驗證碼的時候,設定cookie中的標識