普通的驗證碼對用戶使用體驗不友好,出現了滑動圖片驗證的驗證方式,用戶只要按住滑塊完成圖片的拼接即可通過驗證(這是最簡單的方式,滑動軌跡,數據分析,滑行速度 什么的暫沒考慮)
主要的實現思路:
1.先從一批圖片中隨機抽取一張圖片
2.在服務器端,在該圖片的一個隨機點上對圖片進行切圖處理,形狀可以是 矩形 圓 不規則圖形 等
3.記錄下切圖左上角點的坐標 並保持
4.將切過的 大圖,小圖,原圖 都返回到客戶端
5. 頁面起初顯示原圖片,滑塊顯示切下的小圖,當用戶鼠標按下是顯示切過的大圖, 用戶通過頁面滑塊對切圖進行拼接,當用戶松開鼠標時獲取小圖左上角坐標,並通過ajax傳回到服務器
6.服務器獲取到用戶滑塊的坐標后與保存的切圖左上角坐標進行對比,如果在容差范圍內表示驗證通過否則驗證失敗
https://files.cnblogs.com/files/yaoweijun/SlidingCaptcha%EF%BC%88%E5%9B%BE%E7%89%87%E6%BB%91%E5%8A%A8%E9%AA%8C%E8%AF%81%E7%A0%81%EF%BC%89.zip