新闻项目-渲染主页及图形验证码

一丶渲染主页

将前端代码放入info目录下

 在index中的views渲染主页

from . import blue_index
from flask import render_template

@blue_index.route('/') 
def hello_world():
    return render_template("index/index.html")

1)渲染左侧小图标

from flask import current_app

@blue_index.route("/favicon.ico")
def favicon():
    return current_app.send_static_file("news/favicon.ico")

二丶图形验证码

在modules中创建一个新的文件夹名叫passport

在passport文件夹中创建名称叫views的pthon文件

 完成蓝图的基本配置

__init__中:

from flask import Blueprint

blue_passport = Blueprint("passport",__name__,url_prefix="/passport")

from . import views

views中:

from . import blue_passport

@blue_passport.route("/image_code")
def image_code(): 
　　pass

manage中:

from info.modules.passport import blue_passport

app.register_blueprint(blue_passport)

前端逻辑处理

找到前端中的图形验证码,将src中的测试图片删除

ctrt加左键点击generateImageCode()进入js代码

 补全generateImageCode()的js代码

// TODO 生成一个图片验证码的编号，并设置页面中图片验证码img标签的src属性
function generateImageCode() {
    // 生成uuid
    imageCodeId = generateUUID();
    // url:必须要能访问到image_code视图
    var url = '/passport/image_code?imageCodeId='+imageCodeId;
    // 将url赋值给img标签的src属性,只要src属性给赋值一个url，会立即向该url发送请求
    $('.get_pic_code').attr('src', url);
}

在视图函数中打印测试是否配置成功

from flask import request

print(request.url)

后端逻辑处理

在info中创建一个utils文件夹,并utils文件夹中创建captcha

在captcha中导入生成图形验证码的代码

sr设置全局变量

在全局变量中设置为None,在用global将sr设置为全局变量赋值

逻辑思路

相关代码:

from . import blue_passport
from flask import request,abort,make_response
from info.utils.captcha.captcha import captcha
from info import sr,constants
@blue_passport.route("/image_code")
def image_code():
    # 1.接受参数（uuid）
    imageCodeUUID = request.args.get("imageCodeId")
    # 2.校验参数（判断uuid是否为空）
    if not imageCodeUUID:
        return abort(403)
    # 3.生成图片验证码
    name,imageCodeText,imageCodeIMAGE = captcha.generate_captcha()
    # 4.保存图片验证码到redis
    try:
        sr.set("imageCode:"+imageCodeUUID,imageCodeText,ex=constants.IMAGE_CODE_REDIS_EXPIRES)
    except:
        return abort(500)
    # 5.修改image的ContentType = 'image/jpg'
    response = make_response(imageCodeIMAGE)
    response.headers["Content-Type"] = 'image/jpg'
    # 6.响应图片验证码
    return response