註冊驗證碼

註冊驗證碼。
核心思路，替換註冊頁面的img標籤的src屬性。

一、準備好文件夾：captcha
二、導包 py
from utils.captcha.captcha import captcha
三、驗證碼生成方式 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
四、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()