# 实现拼图滑动验证码
拼图滑动验证码的纯前端简单实现，重要部分都已标注注释，如果需要配合后端可以参考此思路，后端处理图片生成一个带缺口的背景图与一个符合缺口的拼图，并将取得拼图块的位置记录到`SESSION`，将图片与拼图传给前端展示，当用户拖动并松开鼠标后将鼠标轨迹与停留位置发送到后端，后端从`SESSION`中取得位置信息并与前端传递的位置进行对比，有需要的话可以分析此用户轨迹用以区分人机，如果位置偏差小于一定阈值则认为拼图成功。
## 实例
```html
滑动拼图验证码
```
## 每日一题
```
https://github.com/WindrunnerMax/EveryDay
```
## 参考
```
https://zhuanlan.zhihu.com/p/42082496
https://github.com/himushroom/verify-slide
https://www.cnblogs.com/xiaoshen666/p/10968750.html
```