注册功能分析、图片验证码

注意:从数据库中取出来的数据是二进制的要decode()转码成字符串

con_redis.setex(img_code_key,IMAGE_CODE_EXPIRE,text)setex官网    https://redis-py.readthedocs.io/en/latest/#indices-and-tables

项目文件:C:\Users\wanglei\PycharmProjects\untitled14\apps

图形验证码文件:C:\Users\wanglei\PycharmProjects\untitled14\utils\captcha

1,用户名          是否已注册

2,手机号       是否被注册

3,图形验证码

 4,短信验证码,

5,验证成功后,向后台提交数据:用户名,密码,手机号,短信验证


要写这五个视图,

获取图形验证码,请求方式:get 

验证功能单独写在一个 app 中,便于以后的项目可以复用

点住,拉进 apps 中

在主目录下的配置文件中对 这个 app 进行注册

因为使用sys.path.insert(0,BASE_DIR)

                sys.path.insert(1,os.path.join(BASE_DIR,'apps'))

在app verfications.py的views.py中如下:

在主目录下配置文件中 创建个 img_code_verify用于存放文字和图片验证码, #重新创建一个redis缓存数据库
con_redis= get_redis_connection(alias='img_code_verify')中的'img_code_verify‘是settings.py中的redis缓存配置

指向settings.py文件中配置的日志器的django

captcha模块用来生成图形验证和文本验证,不过要安装pillow       captcha模块已经在本地xammp的www文件中


把文本验证码存储到redis缓存数据库中除了键值对,还需要过期时间,单独创建一个py文件设置全局过期时间,以便修改


 为该 app 配置路由

 主路由配置:

在视图中添加日志功能 

因为在配置文件中起的别名是 django 所以, logger = logging.getLogger('django')

在主目录下配置文件中 创建个 verify_codes 用于存放文字和图片验证码,

在视图中:

前端实现:

传入uuid给后台,后台生成验证码存入redis数据库,并且传回给前端

// 预加载,html 加载完后再加载 ,

$(function () {

    let $img = $(".form-item.captcha-graph-img img"); //获取图像标签元素

    let sImageCodeId = "" // uuid  (小写 s 开关,代表字符串 )


    // 生成 uuid 验证码

 function generateImageCode() {

    // 1、生成一个图片验证码随机编号

    sImageCodeId = generateUUID();

    // 2、拼接请求url /image_codes//

    let imageCodeUrl = "/image_codes/" + sImageCodeId + "/";

    // 3、修改验证码图片src地址

    $img.attr('src', imageCodeUrl)

  }


  // 生成图片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;

  }


});

你可能感兴趣的:(注册功能分析、图片验证码)