项目-图形验证码实现

图形验证码实现：

1.先导入相应的包(一个生成图形验证码的库)

from utils.captcha.captcha import captcha
#导入django的相关的redis库，用于存储生成的图形验证码
from django_redis import get_redis_connection

# logging模块是Python内置的标准模块，主要用于输出运行日志，
# 可以设置输出日志的等级、日志保存路径、日志文件回滚等
import logging
logger=logging.getLogger('django');

2.然后在视图函数上写相应的代码

class ImageCode(View):
    def get(self,request,image_code):
        text, image = captcha.generate_captcha();#获取包对应的图形和文字内容，用text和image接收
        con_redis=get_redis_connection('verify_code')#调用redis的库
        redis_key='img_{}'.format(image_code)#生成一个redis的外键
        con_redis.setex(redis_key,300,text)#生成检验时间300秒，将外键很文本信息存入到redis数据库中
        logger.info('image code {}'.format(text))
        return HttpResponse(content=image,content_type='image/jpg')#将生成的图片映射到前台页面，
        # content_type表示图像类型的数据

3.然后在相应的js上面写相应的逻辑代码

let $img = $(".form-item .captcha-graph-img img");   // 获取图像
    genreate();#调用函数
    $img.click(genreate);#点击图片调用相应的函数
    function genreate() {
        let Simagecode=generateUUID(); //生成验证码
        let imageCodeUrl = 'http://127.0.0.1:8000/verification/image_code/'+ Simagecode + '/';//将验证码和随机数相结合
        $img.attr('src' , imageCodeUrl)#j将图像的生成的地址映射到前台
    }
     // 生成图片UUID验证码
    function generateUUID() {
      let d = new Date().getTime();
      if (window.performance && typeof window.performance.now === "function") {
          d += performance.now(); //use high-precision timer if available
      }
      let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
          let r = (d + Math.random() * 16) % 16 | 0;
          d = Math.floor(d / 16);
          return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
      });
      return uuid;
    }

然后在相应的urls中配置相应的路由

path("image_code/<uuid:image_code>/",views.ImageCode.as_view(),name="image_code"),

在相应的setting中配置一个redis数据库，用于存放图像验证码

 # 配置redis的库，用来缓冲图形验证码
    'verify_code':{
        "BACKEND": "django_redis.cache.RedisCache",
        "LOCATION": "redis://127.0.0.1:6379/1",
        "OPTIONS": {
            "CLIENT_CLASS": "django_redis.client.DefaultClient",
    }