• 圖形驗(yàn)證碼功能實(shí)現(xiàn)

uniapp：解決圖形驗(yàn)證碼問題及利用arraybuffer二進(jìn)制轉(zhuǎn)base64格式圖片（后端傳的圖片數(shù)據(jù)形式：x00\x10JFIF\x00\x01\x02\x00…）_?VE?的博客-CSDN博客

• UI稿：

• ?需求：向后端請求驗(yàn)證碼圖片，然后用戶輸入圖片驗(yàn)證碼之后，在校驗(yàn)通過之后才執(zhí)行后面的邏輯
• 難點(diǎn)：如何通過前端input框輸入的值，即時(shí)與后端返回的圖片進(jìn)行校驗(yàn)
• 解析：我們前端對這種自己輸入的值以及后端傳的圖片驗(yàn)證碼是無法比較的，一個(gè)使圖片的格式，一個(gè)使數(shù)字/字符串類型，如何解決呢
• 解決方法：想到兩個(gè)點(diǎn)，與后端商量，利用cookic解決，但是我們測試了下，沒有拿到cookic值，具體原因我們也沒找到；第二個(gè)方法就是他自定義了一個(gè)md5加密放到了響應(yīng)頭中，我拿到這個(gè)md5對應(yīng)的值之后，在檢驗(yàn)的請求中將其寫待到請求頭中，從而也因?yàn)樗o我們前后端加了一個(gè)檢驗(yàn)的橋梁，因而實(shí)現(xiàn)了圖片驗(yàn)證碼的校驗(yàn)。
• 代碼邏輯：

• 查看請求：

?

• 實(shí)現(xiàn)的效果圖：校驗(yàn)成功

?