TP5 驗證碼功能實現
功能開發
1).引入第三方擴充套件包
進行 TP5 的開發,Composer 的使用會成為重要技能 以windows為例子,輸入命令:
composer require topthink/think-captcha 1 完成上述操作,會在以下目錄中出現 captcha 的擴充套件包
..\vendor\topthink\think-captcha 1 2).前端設定
在前端頁面需要顯示驗證碼的位置,補充 {:captcha_img()} 即可,個人程式碼舉例如下:
<p class="pass-form-item"> <label class="pass-label">驗證碼</label> <input type="text" name="verifyCode" class="pass-text-input " placeholder="請輸入驗證碼"> <div>{:captcha_img()}</div> </p>
3). captcha 擴充套件包程式碼優化
如果按照上述操作,顯示的驗證碼圖片並不能點選重新整理,可自己根據需求進行重新整理功能設計;或者,建議進行下面的程式碼優化:
function captcha_img($id = "") { $js_src = "this.src='".captcha_src()."'"; return '<img src="' . captcha_src($id) . '" alt="點選更新驗證碼" onclick="'.$js_src.'" />'; //return '![](' . captcha_src($id) . ')'; } 開啟 ..\vendor\topthink\think-captcha\src\helper.php 檔案,替換上面的 captcha_img() 方法程式碼. 此時的驗證碼圖片即可實時重新整理.
<input type="text" name="code" id="code" value="" placeholder="驗證碼" /> <img src="{:captcha_src()}" onclick="this.src='{:captcha_src()}?'+Math.random();" width="120" style=cursor:pointer;" alt="captcha" />
4). 後臺程式碼驗證
根據前端請求而來的 verifyCode 資料,呼叫 helper.php 中的captcha_check() 方法,進行驗證。
if(request()->isPost()){ $data = input('post.'); if(!captcha_check($data['verifyCode'])) { // 校驗失敗 $this->error('驗證碼不正確'); } } 二種方法:
1-安裝
composer require topthink/think-captcha 1.* -vvv 2-配置檔案
'captcha' => [ // 驗證碼字元集合3. 'codeSet' => '2345678abcdefhijkmnpqrstuvwxyzABCDEFGHJKLMNPQRTUVWXY', // 驗證碼字型大小(px)5. 'fontSize' => 28, // 是否畫混淆曲線7. 'useCurve' => false, // 驗證碼圖片高度9. 'imageH' => 50, // 驗證碼圖片寬度11. 'imageW' => 200, // 驗證碼位數13. 'length' => 4, // 驗證成功後是否重置 15. 'reset' => true ], 3-html 程式碼
<div class="yzm"> <img src="{:captcha_src()}" class="verify" onclick="resVerify()" alt="驗證碼" /> <a href="javascript:resVerify();" >看不清,換一張</a> </div> 或者
<img src="{:captcha_src()}" class="verify" onclick="javascript:this.src='{:captcha_src()}?rand='+Math.random()" > 4-控制器 登入時候的驗證
$captcha=input("captcha"); //驗證 if (!captcha_check($captcha)){ exit(json_encode(array('status'=>0,'msg'=>'驗證碼錯誤'))); } 或者 //驗證碼驗證碼 $captcha = new Captcha(); if (!$captcha->check(input("captcha"))){ return $this->error("驗證碼錯誤");