美文网首页
2020-06-17--flask项目03--注册功能01-验证

2020-06-17--flask项目03--注册功能01-验证

作者: program_white | 来源:发表于2020-06-18 12:27 被阅读0次

    注册模块的实现

    创建注册模块的蓝图

    在modelus包下创建package包--passport,并在该包下创建views.py文件
    init.py中创建蓝图对象:

    from flask import Blueprint
    
    passport_blue = Blueprint('passport',__name__,url_prefix='/passport')
    
    from . import views
    

    在create_app函数中注册蓝图对象:

        from newsInfo.modules.passport import passport_blue
        app.register_blueprint(passport_blue)
    

    验证码

    查看响应的js事件

    点击注册后,主要实现的内容就是验证码和手机验证码的实现,
    那么首先检查一下验证码的前端代码块:



    该验证码有一个响应事件generateImageCode(),那么我们就在js代码中寻找这个事件:


    编写generateImageCode()函数

    var imageCodeId = ""
    var preimageCodeId = ""
    // TODO 生成一个图片验证码的编号,并设置页面中图片验证码img标签的src属性
    function generateImageCode() {
        imageCodeId = generateUUID()          //获取不重复的随机字符串
        //验证码图片地址
        image_url = '/passport/image_code?cur_id='+imageCodeId+'&pre_id='+preimageCodeId+''
    
        //每触发一次之间就替换一次src的地址
        $('.get_pic_code').attr('src',image_url)
    
        //记录图片的编号
        preimageCodeId = imageCodeId
    }
    

    分析:该函数在每次要生成一个随机字符串,用于获取验证码的地址,并且每触发一次该函数,就改变一次随机值,最后要记录该值。并且验证码地址的url也是要与后台相匹配的。

    编写views代码

    对于验证码,要使用到一个工具包,这个工具包一般保存在一个叫utils的包下。

    1. 首先在newsInfo包下新建utils包,把captcha文件复制到该包下。
      这时候可能会报错,因为验证码使用的pillow模块未安装
      安装即可pip install Pillow
      还有一个response_code.py文件也复制到utils包下,与captcha同一级别。

    在captcha文件下有一个capycha.py.运行一下:
    打印输出的是:



    这个aptcha.generate_captcha()就是我们要用的东西。

    2.因为我们要生成验证码图片并且要保存到redis数据库用于登陆验证,所以要先配置一下redis数据库:

    redis.StrictRedis(host=config.RDIES_HOST,port=config.RDIES_PORT)
    

    要把这个数据库设定为一个全局的变量,
    在newsInfo/init.py:

    1.在函数外设定一个变量
    redis_store = None
    2.在函数中尽心配置该变量的初始化工作
         # 初始化全局redis配置
        global redis_store
        redis_store = redis.StrictRedis(host=config.RDIES_HOST,port=config.RDIES_PORT)
    

    3.在之前在create_app()中配置了redis数据库
    在passport/views.py编写生成验证码图片的代码:

    from . import passport_blue
    
    from flask import request, jsonify, current_app, make_response
    from newsInfo.utils.response_code import RET
    from newsInfo.utils.captcha.captcha import captcha
    from ... import redis_store, constants
    
    
    '''图片验证码'''
    #功能描述: 图片验证码
    #请求地址: /passport/image_code?cur_id=xxx&pre_id=xxx
    #请求方式: GET
    #请求参数: 随机字符串(uuid)cur_id, 上一个字符串:pre_id
    #返回值:  返回图片
    @passport_blue.route('/image_code')
    def get_image_code():
        '''
        思路:
        1.获取参数
        2.校验参数,查看参数的存在性
        3.利用captcha工具获取验证码信息
        4.保存到redis中
        5.返回验证码图片信息
        :return:
        '''
        #1.获取url中?后的参数,也就是get方式访问携带的参数
        cur_id = request.args.get('cur_id')
        pre_id = request.args.get('pre_id')
    
        #2.校验参数
        if not cur_id:
            return jsonify(errno = RET.PARAMERR,errmsg='参数不全')
        #3.生成图片验证码
        try:
            #获取图片信息
            name,text,image_data = captcha.generate_captcha()
    
            #保存到redis中
            '''
            参数1:保存到redis的key
            参数2:图片验证码的text文本
            参数3:过期时间
            '''
            redis_store.set('image_code:%s'%cur_id,text,constants.IMAGE_CODE_REDIS_EXPIRES)
    
            #判断有没有上一个图片的编号
            if pre_id:
                #释放该编号的验证码信息
                redis_store.delete('image_code:%s'%pre_id)
        except Exception as e:
    
            current_app.logger.error(e)
            return jsonify(errno = RET.DBERR,errmsg='验证码操作失败')
    
        #返回验证码图片信息
        response = make_response(image_data)   #16进制信息
        #把回应头改为image格式
        response.headers['Content-Type'] = 'image/jpg'
    
        return response
    

    具体的分析已经在代码中。
    运行:
    1.在首页中点击右上角 --- 注册按钮:
    生成验证码:



    2.点击验证码图片
    重新生成验证码:



    3.点击立即登录按钮

    在点击立即注册按钮

    重新生成验证码

    在redis数据库中始终只存储一个验证码图片的信息,当生成新的验证码时,就删除旧的验证码。

    这三种情况就对应了main.js中generateImageCode()函数的调用情况:


    相关文章

      网友评论

          本文标题:2020-06-17--flask项目03--注册功能01-验证

          本文链接:https://www.haomeiwen.com/subject/goqexktx.html