验证码常用于注册场景,用以防止恶意写入数据。
在简单的注册业务中,用户填写注册信息后,需要填写验证码。
后台再根据各项目规则对每项进行校验,完全校验通过后才完成注册。
注册时,为了防止恶意注册,往往采用图像验证码结合短信验证码的方式。
图像验证码、短信验证码的表单提交、后端校验实现逻辑
- 前端请求图像验证码,并携带uuid唯一标识符(GET请求)
- 后端收到请求后生成验证码字符串和对应验证码图片
- 后端将uuid与验证码字符串以键值对形式存入数据库,如redis,并设置过期时间
- 后端将验证码图片数据以响应给前端加载显示给用户
- 用户在前端页面输入图像验证码
- 用户前端输入手机号请求短信验证码,并携带图像验证码与uuid参数(POST请求)
- 后端接收请求,获取图像验证码、uuid、手机号
- 后端根据uuid键在数据库中查找对应图像验证码值,与提交的值比较,若一致,执行发送短信验证码;否则,返回图像验证码错误
- 生成随机短信验证码,保存至数据库,如redis中
- 使用第三方平台如容联云通讯发送短信验证码(使用celery异步执行)
- 响应状态码
以下只实现后端图形验证码发送功能,注册验证功能暂不叙述,给自己留个坑。
图形验证码后端发送实现
接口定义
根据前端请求路径或开发文档定义路由路径
- 总路由
在总路由中添加规则:
url('^', include('verifycations.urls')),
- 子路由
使用正则匹配前端传输的uuid唯一标识
url('^image_codes/(?P<uuid>[\w-]+)/$', views.ImageCodeView.as_view()),
- 视图函数定义
- 定义get方法俩接收GET请求
- 参数中接收url中的uuid
- 使用第三方包captcha来自动生成图形验证码
text, code, image = captcha.generate_captcha()
调用方法可解包得到三个数据,分别为标识码、验证码字符串、验证码图片二进制数据。第二个和第三个数据是这里要使用的。 - 需要安装Pillow包
- 在settings中添加redis图形验证码的缓存设置,选择redis的2号数据库为图形验证码储存位置。
# 缓存
CACHES = {
"default": { # 默认
"BACKEND": "django_redis.cache.RedisCache",
"LOCATION": "redis://127.0.0.1:6379/0", # 可改:ip、port、db
"OPTIONS": {
"CLIENT_CLASS": "django_redis.client.DefaultClient",
}
},
"session": { # session
"BACKEND": "django_redis.cache.RedisCache",
"LOCATION": "redis://127.0.0.1:6379/1",
"OPTIONS": {
"CLIENT_CLASS": "django_redis.client.DefaultClient",
}
},
"image_code": { # 图形验证码
"BACKEND": "django_redis.cache.RedisCache",
"LOCATION": "redis://127.0.0.1:6379/2",
"OPTIONS": {
"CLIENT_CLASS": "django_redis.client.DefaultClient",
}
},
}
视图函数实现如下:
from django.views import View
from meiduo_mall.libs.captcha.captcha import captcha
from django_redis import get_redis_connection
# 自定义的验证码过期时间配置文件
from . import constants
from django import http
class ImageCodeView(View):
def get(self, request, uuid):
# 接收
# 验证
# 处理:
# 1.生成图片的文本、数据
text, code, image = captcha.generate_captcha()
# 2.连接到redis
redis_cli = get_redis_connection('image_code')
# 3.保存图片文本,用于后续与用户输入值对比,设置过期时间
redis_cli.setex(uuid, constants.IMAGE_CODE_EXPIRES, code)
# 4.响应:输出图片数据
return http.HttpResponse(image, content_type='image/png')
结合前端页面刷新加载和的点击刷新逻辑,图形验证码的发送功能就实现了。
短信验证码后端发送实现
见下一篇文章: