注册验证码。
核心思路，替换注册页面的img标签的src属性。
1、准备好文件夹：captcha
2、导包 py
from utils.captcha.captcha import captcha
3、验证码生成方式 py
@index_blue.route('/getimage')
def get_image():
# name, text, StringIO.value
# text : 验证码图片对应到到文本
# image_url ： 验证码图片IO流。理解为：二进制数据，并没有实际转换成图片呢
name, text, image_url = captcha.generate_captcha()
session['img_code'] = text
response = make_response(image_url) # 生成图片到响应
# 告诉浏览器，我要返回到是一张图片
response.headers['Content-Type'] = 'image/jpg'
return response
4、js逻辑
导入
<script type="text/javascript" src="../static/js/jquery-1.12.4.min.js"></script>
（1）生成唯一标识 html
验证码:<input type="text" name="imgcode"><img src="" alt="验证码" id="a" onclick="generateImageCode()">
<script>
function generateUUID() {
var d = new Date().getTime();
if(window.performance && typeof window.performance.now === "function"){
d += performance.now(); //use high-precision timer if available
}
var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = (d + Math.random()*16)%16 | 0;
d = Math.floor(d/16);
return (c=='x' ? r : (r&0x3|0x8)).toString(16);
});
return uuid;
}
</script>
（2）替换注册页面的验证码图片 html
var imageCodeId = ""
var preimageCodeId = ""
// TODO 生成一个图片验证码的编号，并设置页面中图片验证码img标签的src属性
function generateImageCode() {
//生成一个随机字符串uuid
imageCodeId = generateUUID()
//拼接请求路径,和一个字符串没有什么两样
image_url = "/get_image?cur_id="+imageCodeId + "&pre_id="+preimageCodeId
//将image_Url设置到img标签中src, IMG标签只要设置了里面的src属性,会自动去请求跟上的地址
$("#a").attr("src",image_url)
// 记录上一次的uuid
preimageCodeId = imageCodeId
}
generateImageCode()
