制作屬于自己的網(wǎng)站,群暉wordpress端口映射,北京市建設(shè)工程信息網(wǎng)告知性備案,博愛(ài)seo排名優(yōu)化培訓(xùn)驗(yàn)證碼實(shí)現(xiàn)easy-captcha引入依賴坐標(biāo)支持的驗(yàn)證碼類型SpecCaptcha構(gòu)造方法獲取 / 輸出方法樣式配置方法驗(yàn)證碼實(shí)現(xiàn)的代碼示例在 Java 開(kāi)發(fā)中#xff0c;最常用的驗(yàn)證碼類型有圖片驗(yàn)證碼、短信 / 郵箱驗(yàn)證碼、行為驗(yàn)證碼#xff0c;在這里我們主要介紹一下圖片驗(yàn)證碼的相關(guān)內(nèi)容…驗(yàn)證碼實(shí)現(xiàn)easy-captcha引入依賴坐標(biāo)支持的驗(yàn)證碼類型SpecCaptcha構(gòu)造方法獲取 / 輸出方法樣式配置方法驗(yàn)證碼實(shí)現(xiàn)的代碼示例在 Java 開(kāi)發(fā)中最常用的驗(yàn)證碼類型有圖片驗(yàn)證碼、短信 / 郵箱驗(yàn)證碼、行為驗(yàn)證碼在這里我們主要介紹一下圖片驗(yàn)證碼的相關(guān)內(nèi)容。easy-captcha核心定位easy-captcha 是一款專為 Java Web 場(chǎng)景設(shè)計(jì)的輕量級(jí)開(kāi)源驗(yàn)證碼庫(kù)核心目標(biāo)是簡(jiǎn)化各類驗(yàn)證碼的開(kāi)發(fā)與集成替代手寫(xiě)驗(yàn)證碼的復(fù)雜底層實(shí)現(xiàn)。核心價(jià)值該庫(kù)封裝了畫(huà)布創(chuàng)建、隨機(jī)字符生成、干擾線 / 噪點(diǎn)繪制、IO 流輸出等所有手寫(xiě)驗(yàn)證碼的底層細(xì)節(jié)大幅降低開(kāi)發(fā)成本開(kāi)發(fā)者僅需幾行代碼即可快速實(shí)現(xiàn)驗(yàn)證碼功能無(wú)需關(guān)注圖形繪制的底層邏輯。核心特性零依賴輕量化僅依賴 JDK 內(nèi)置的 AWT 繪圖類庫(kù)無(wú)需引入任何第三方依賴打包體積小部署無(wú)額外成本多類型全覆蓋支持靜態(tài)圖片、動(dòng)態(tài) GIF、算術(shù)運(yùn)算、中文漢字等主流驗(yàn)證碼類型滿足絕大多數(shù)業(yè)務(wù)場(chǎng)景需求高度可定制化支持自定義驗(yàn)證碼長(zhǎng)度、圖片尺寸、字體樣式、顏色方案、干擾元素等適配個(gè)性化視覺(jué)需求輸出方式靈活支持三種輸出形式 —— 本地文件、HTTP 響應(yīng)流適配傳統(tǒng) Web 項(xiàng)目、Base64 編碼字符串適配前后端分離項(xiàng)目Web 生態(tài)友好原生適配 Servlet/JSP、Spring MVC、Spring Boot 等 Java Web 技術(shù)棧提供開(kāi)箱即用的工具類無(wú)需額外適配。引入依賴坐標(biāo)dependencygroupIdcom.github.whvcse/groupIdartifactIdeasy-captcha/artifactIdversion1.6.2/version/dependency1.6.2 是 easy-captcha 的穩(wěn)定版本適配 JDK 8如果項(xiàng)目使用的是 JDK 11建議使用 1.7.0 及以上版本修復(fù)了高版本 JDK 的兼容問(wèn)題。支持的驗(yàn)證碼類型靜態(tài)驗(yàn)證碼靜態(tài) PNG 格式性能最高子類型實(shí)現(xiàn)類核心特點(diǎn)適用場(chǎng)景輕量字符驗(yàn)證碼CharCaptcha專注數(shù)字 / 字母 / 混合字符對(duì)性能要求高的簡(jiǎn)單場(chǎng)景純數(shù)字驗(yàn)證碼NumericCaptcha僅含 0-9 數(shù)字普通登錄、簡(jiǎn)單驗(yàn)證純字母驗(yàn)證碼LetterCaptcha含大小寫(xiě)英文字母中等安全需求的驗(yàn)證數(shù)字 大寫(xiě)字母驗(yàn)證碼SpecCaptcha數(shù)字 大寫(xiě)字母且剔除易混淆字符絕大多數(shù)通用登錄 / 注冊(cè)場(chǎng)景算術(shù)運(yùn)算驗(yàn)證碼ArithmeticCaptcha生成 0-99 加減乘算術(shù)題登錄 / 注冊(cè)等核心業(yè)務(wù)場(chǎng)景中文驗(yàn)證碼ChineseCaptcha隨機(jī)中文漢字防破解能力遠(yuǎn)高于字符類高安全需求動(dòng)態(tài)驗(yàn)證碼GIF 格式防識(shí)別最強(qiáng)子類型實(shí)現(xiàn)類核心特點(diǎn)適用場(chǎng)景字符 GIF 驗(yàn)證碼GifCaptcha字符隨機(jī)位移 / 閃爍高安全防爬蟲(chóng)場(chǎng)景中文 GIF 驗(yàn)證碼ChineseGifCaptcha漢字隨機(jī)位移 / 閃爍極高安全需求算術(shù) GIF 驗(yàn)證碼ArithmeticGifCaptcha算術(shù)題字符動(dòng)態(tài)位移核心業(yè)務(wù)和高防爬需求下面具體介紹 SpecCaptcha 類SpecCaptchaSpecCaptcha 是開(kāi)源驗(yàn)證碼庫(kù) easy-captcha 面向通用 Web 驗(yàn)證場(chǎng)景設(shè)計(jì)的靜態(tài)圖片驗(yàn)證碼實(shí)現(xiàn)類。該類的核心字符集限定為數(shù)字0-9與大寫(xiě)英文字母A-Z并通過(guò)剔除 0/O、1/I、8/B 等視覺(jué)易混淆字符降低用戶識(shí)別誤差。輸出形態(tài)為 PNG 格式靜態(tài)圖片具備生成效率高、加載速度快的特性在易用性、安全防護(hù)能力與用戶體驗(yàn)間實(shí)現(xiàn)平衡是 Java Web 項(xiàng)目中登錄、注冊(cè)等常規(guī)驗(yàn)證場(chǎng)景的主流選型。下面介紹該庫(kù)的部分使用方法主要介紹構(gòu)造方法、核心獲取 / 輸出方法 以及 樣式配置方法。構(gòu)造方法用于創(chuàng)建 SpecCaptcha 實(shí)例支持自定義圖片尺寸、驗(yàn)證碼長(zhǎng)度方法簽名說(shuō)明SpecCaptcha()無(wú)參構(gòu)造默認(rèn)寬度 150、高度 50、驗(yàn)證碼長(zhǎng)度 4SpecCaptcha(int width, int height)指定寬高驗(yàn)證碼長(zhǎng)度默認(rèn) 4SpecCaptcha(int width, int height, int len)自定義寬、高、驗(yàn)證碼長(zhǎng)度最常用獲取 / 輸出方法這類方法是驗(yàn)證碼使用的核心用于獲取驗(yàn)證碼文本、生成圖片、輸出到流方法簽名說(shuō)明String text()獲取生成的驗(yàn)證碼文本BufferedImage image()生成驗(yàn)證碼圖片的 BufferedImage 對(duì)象void out(OutputStream os)將驗(yàn)證碼圖片以 PNG 格式寫(xiě)入輸出流Web 場(chǎng)景中寫(xiě)入響應(yīng)流void out(ServletOutputStream sos)重載方法適配 Servlet 響應(yīng)流簡(jiǎn)化 Web 輸出String toBase64()將驗(yàn)證碼圖片轉(zhuǎn)換為 Base64 編碼字符串適用于前后端分離場(chǎng)景String toBase64(boolean deletePrefix)轉(zhuǎn)換為 Base64deletePrefixtrue 則移除 data:image/png;base64, 前綴樣式配置方法自定義驗(yàn)證碼外觀用于調(diào)整驗(yàn)證碼的字體、尺寸、干擾元素、背景等樣式均為 set/get 成對(duì)出現(xiàn)void setWidth(int width) / int getWidth() 設(shè)置 / 獲取驗(yàn)證碼圖片寬度void setHeight(int height) / int getHeight() 設(shè)置 / 獲取驗(yàn)證碼圖片高度void setLen(int len) / int getLen() 設(shè)置 / 獲取驗(yàn)證碼字符長(zhǎng)度void setCharType(int charType) / int getCharType() 設(shè)置 / 獲取字符類型核心可選值Captcha.TYPE_DEFAULT中文Captcha.TYPE_ONLY_NUMBER純數(shù)字Captcha.TYPE_ONLY_CHAR純字母Captcha.TYPE_MIX數(shù)字 字母void setFont(Font font) / Font getFont() 設(shè)置 / 獲取字符字體支持自定義字體、字號(hào)、加粗void setInterfereLineCount(int count) / int getInterfereLineCount() 設(shè)置 / 獲取干擾線數(shù)量void setNoiseCount(int count) / int getNoiseCount() 設(shè)置 / 獲取干擾像素點(diǎn)void setBackground(Color color) / Color getBackground() 設(shè)置 / 獲取圖片背景色void setCharColor(Color color) / Color getCharColor() 設(shè)置 / 獲取字符顏色默認(rèn)隨機(jī)顏色驗(yàn)證碼實(shí)現(xiàn)的代碼示例前端 vue 代碼示例templatedivclasscaptcha-containerel-formrefcaptchaForm:modelloginForm:rulesloginRulesel-form-itempropcaptchael-inputrefcaptchav-modelloginForm.captchaplaceholder請(qǐng)輸入驗(yàn)證碼prefix-iconel-icon-circle-checknamecaptchastylewidth:65%sizedefault/!-- 驗(yàn)證碼圖片支持點(diǎn)擊刷新與展示圖片 --el-imageclasscaptcha-img:srccaptchaPathclickgetCaptcha()//el-form-item/el-form/div/templatescript// 驗(yàn)證碼API導(dǎo)入import{getCaptchaImg}from/api/sys/loginexportdefault{name:CaptchaDemo,data(){return{captchaPath:,loginForm:{captcha:,// 用戶輸入的驗(yàn)證碼uuid:// 驗(yàn)證碼唯一標(biāo)識(shí)傳給后端驗(yàn)證用},// 驗(yàn)證碼輸入校驗(yàn)規(guī)則loginRules:{captcha:[{required:true,message:請(qǐng)輸入驗(yàn)證碼,trigger:blur}]}}},// 頁(yè)面創(chuàng)建時(shí)自動(dòng)加載驗(yàn)證碼created(){this.getCaptcha()},methods:{// 核心獲取/刷新驗(yàn)證碼getCaptcha(){getCaptchaImg().then(res{this.captchaPathres.data.captcha// 賦值驗(yàn)證碼圖片地址this.loginForm.uuidres.data.uuid// 保存驗(yàn)證碼唯一標(biāo)識(shí)// 開(kāi)發(fā)環(huán)境自動(dòng)填充驗(yàn)證碼if(process.env.NODE_ENVdevelopment){this.loginForm.captchares.data.code}})}}}/scriptstylelangscssscoped.captcha-container{padding:30px;background:#ffffff;width:390px;border-radius:5px; .captcha-img{width:100px;height:40px;margin-left:8px;position:absolute;cursor:pointer;}}/style其中導(dǎo)入的驗(yàn)證碼 API 的邏輯內(nèi)容為exportfunctiongetCaptchaImg(){returnrequest({url:/captcha,method:get})}后端邏輯代碼示例RestControllerpublicclassLoginController{AutowiredprivateRedisTemplateredisTemplate;/** * 獲取驗(yàn)證碼 * * return */GetMapping(/captcha)publicResultgetCaptcha(){// 借助工具包生成符合要求的驗(yàn)證碼SpecCaptchaspecCaptchanewSpecCaptcha(130,48,4);// 獲取到驗(yàn)證碼圖片的內(nèi)容值并轉(zhuǎn)大寫(xiě)StringcodespecCaptcha.text().toUpperCase();// 用uuid生成唯一的key用于存儲(chǔ)驗(yàn)證碼StringuuidIdUtil.simpleUUID();// 往redis里存數(shù)據(jù)redisTemplate.opsForValue().set(uuid,code,120,TimeUnit.SECONDS);// 往回組裝數(shù)據(jù)HashMapString,StringresnewHashMapString,String();res.put(uuid,uuid);// 獲取Base64編碼res.put(captcha,specCaptcha.toBase64());res.put(code,code);returnResult.ok().put(data,res);}}Base64 編碼的核心作用后端通過(guò) easy-captcha 生成驗(yàn)證碼圖片后會(huì)得到圖片的二進(jìn)制數(shù)據(jù)字節(jié)流Base64 編碼能將這種二進(jìn)制數(shù)據(jù)轉(zhuǎn)換成可打印的文本字符串避免二進(jìn)制傳輸?shù)膩y碼 / 解析問(wèn)題這段代碼中 specCaptcha.toBase64() 會(huì)直接生成包含 Data URI 前綴如data:image/png;base64,的 Base64 字符串前端拿到后無(wú)需手動(dòng)拼接前綴直接將這個(gè)字符串賦值給img標(biāo)簽的 src 屬性瀏覽器就能自動(dòng)解碼 Base64 字符串并渲染出驗(yàn)證碼圖片。