滑动验证码必须由后端校验，因前端验证易被绕过；Django需在views.py中实现token绑定、时间窗口校验、容差比对（±5px）及单次失效机制，并动态生成加密缺口位置。
滑动验证码为什么不能只靠前端验证
滑动验证码的校验逻辑必须放在后端，前端只负责渲染和用户交互。如果只在前端做距离比对或轨迹判断，攻击者能轻易绕过——直接构造 POST 请求跳过滑动动作，或者用 Selenium 模拟固定偏移量。Django 的 views.py 必须承担坐标校验、时间窗口验证、token 绑定与失效等责任。
常见错误现象：403 Forbidden 或静默失败但日志里没报错，往往是因为校验逻辑漏掉了 session 绑定或未清除已使用 token。
- 滑块初始位置、背景图缺口位置需在服务端生成并加密存入 session 或缓存（如 Redis），不能由前端传入 raw 坐标
- 用户提交的
x偏移量需与服务端记录的“正确缺口横坐标”做容差比对（通常 ±5px 内算通过） - 单次 token 仅能使用一次，且有效期建议设为 120 秒，超时或已验证则立即失效
Django 视图中如何生成并校验滑块参数
核心是分离“生成验证码”和“校验滑块”两个接口，避免状态混淆。推荐用 Django 的 session 存储临时凭证，而非数据库写入——轻量、快速、天然绑定用户会话。
示例流程：
立即学习“Python免费学习笔记（深入）”；
抓取并分析 OpenClaw JSONL 会话日志，重建并回填代理记忆文件。适用于：(1) 模型切换后记忆不完整，(2) 验证记忆覆盖度，(3) 重建丢失记忆，(4) 通过 cron/heartbeat 自动同步每日记忆。支持简单提取及基于 LLM 的叙事摘要，并自动清理敏感信息。
def get_slider_captcha(request):
# 生成随机缺口位置（比如 120px）
correct_x = random.randint(80, 200)
# 加密存储：用 salt + correct_x + timestamp 构造 token
token = hashlib.md5(f"{correct_x}_{time.time()}_{settings.SECRET_KEY}".encode()).hexdigest()[:16]
request.session['slider_token'] = token
request.session['slider_correct_x'] = correct_x
request.session['slider_created_at'] = time.time()
return JsonResponse({
'token': token,
'bg_url': '/static/captcha/bg.jpg',
'thumb_url': '/static/captcha/thumb.png'
})
<p>def verify_slider(request):
if request.method != 'POST':
return JsonResponse({'valid': False, 'msg': 'method not allowed'}, status=405)</p><pre class='brush:python;toolbar:false;'>token = request.POST.get('token')
user_x = int(request.POST.get('x', 0))
# 校验 token 是否匹配、是否超时、是否已被用过
if (not token
or token != request.session.get('slider_token')
or time.time() - request.session.get('slider_created_at', 0) > 120
or abs(user_x - request.session.get('slider_correct_x', 0)) > 5):
return JsonResponse({'valid': False, 'msg': 'invalid or expired'})
# 成功后立即清空 session 中的校验数据
request.session.pop('slider_token', None)
request.session.pop('slider_correct_x', None)
request.session.pop('slider_created_at', None)
return JsonResponse({'valid': True})</pre>前端提交时容易忽略的三个关键字段
很多前端同学只传 x 坐标，但服务端校验依赖三要素：唯一 token、用户拖动偏移量、请求时间戳。缺一不可。
-
token：必须从get_slider_captcha接口返回中获取，且每次刷新验证码都要更新，不能复用旧值 -
x：是浏览器 clientX 减去滑块容器左边界后的相对像素值，不是 pageX，也不是百分比 -
timestamp（可选但推荐）：前端 JS 获取Date.now()并随表单提交，服务端可用于检测异常耗时（如 200ms 内完成滑动基本是机器行为）
若没传 token，Django 会返回 None 导致 abs(user_x - None) 报 TypeError；若没清空 session，同一 token 可重复通过校验。
生产环境必须替换默认的静态图片和混淆策略
直接用固定 bg.jpg 和 thumb.png 是重大风险：攻击者下载一次就能离线穷举所有偏移量。必须动态生成背景图或轮换素材，并对缺口位置做非线性映射。
- 不要硬编码缺口横坐标，改用哈希函数将 token 映射为偏移量：
correct_x = int(hashlib.sha256(token.encode()).hexdigest()[:6], 16) % 150 + 50 - 背景图建议每小时轮换一组（存于
media/captcha_bg/），路径由后端拼接返回，不暴露规律 - 滑块图 thumb 不要透明 PNG，加轻微噪点和 1px 边框，增加 OCR 识别难度
真正难的不是实现滑动效果，而是让每次生成的“正确答案”不可预测、不可重放、不可批量模拟——这需要服务端逻辑严密，而不是前端动画炫酷。
