其實thinkphp5驗證碼也簡單的了,不過首先需要保證你的一下擴展包。
不過只要你安裝的是完整版的話系統都會自帶有的啦,因爲我這個就是完整版的。
好啦,有了這個擴展包了之後直接在模板文件裏面放一個驗證碼標籤就立馬見效。
標籤如下:
<div>{:captcha_img()}</div>
<h2>驗證碼</h2>
<form method="post" action="{:url('check')}">
輸入驗證碼:<input type="text" class="text" name="captcha">
<div id="captcha_image" onclick="code();">{:captcha_img()}</div>
<span style="color:red;">{$codeerror}</span><br/>
<input type="submit" value="提交"/>
</form>
<!---這個js方法是 切換驗證碼圖片用的--->
<script>
function code(){
var querysrc=document.getElementById('captcha_image');
querysrc.getElementsByTagName('img')[0].src='http://localhost{:captcha_src()}?'+Math.random();
}
</script>
或者也可以用另一個標籤:
<div><img src="{:captcha_src()}" alt="captcha" /></div>
<h2>驗證碼</h2>
<form method="post" action="{:url('check')}">
輸入驗證碼:<input type="text" class="text" name="captcha">
<!---這個方法寫切換驗證碼圖片比較方便,直接onclick 一行代碼搞定 -->
<div ><img src="{:captcha_src()}" onclick="this.src='http://localhost{:captcha_src()}?'+Math.random()" alt="captcha" /></div>
<span style="color:red;">{$codeerror}</span><br/>
<input type="submit" value="提交"/>
</form>
這兩個都是一樣的效果。
驗證碼的配置
需要在application/config.php配置文件裏面配置一下驗證碼的幾個必要的參數,因爲默認的可能不是你想要的樣子。比如驗證碼的大小啊還有驗證碼需要幾位數之類的。
//驗證碼配置
'captcha'=>[
//字體大小
'fontSize'=>15,
//驗證碼長度(位數)
'length'=>4,
//使用中文驗證碼
// 'useZh'=>true,
],
驗證碼的配置參數
參數 | 描述 | 默認 |
---|---|---|
codeSet | 驗證碼字符集合 | 略 |
expire | 驗證碼過期時間(s) | 1800 |
useZh | 使用中文驗證碼 | false |
zhSet | 中文驗證碼字符串 | 略 |
useImgBg | 使用背景圖片 | false |
fontSize | 驗證碼字體大小(px) | 25 |
useCurve | 是否畫混淆曲線 | true |
useNoise | 是否添加雜點 | true |
imageH | 驗證碼圖片高度,設置爲0爲自動計算 | 0 |
imageW | 驗證碼圖片寬度,設置爲0爲自動計算 | 0 |
length | 驗證碼位數 | 5 |
fontttf | 驗證碼字體,不設置是隨機獲取 | 空 |
bg | 背景顏色 | [243, 251, 254] |
reset | 驗證成功後是否重置 | true |
下面是控制器的代碼,在控制器裏面除了驗證規則需要寫點代碼之外其他不需要的可以不寫。因爲我這裏主要講的是驗證碼其他不關係到驗證碼的東西沒有,所以除了驗證規則之外控制器可以是空的。
<?php
namespace app\index\controller;
use think\Controller;
//引入驗證
use think\Validate;
class Index extends Controller
{
/**
* @param string $name
*/
public function index()
{
return $this->fetch();
}
//檢查驗證碼
public function check($captcha=''){
$data['captcha' ]=$captcha;
//實例化驗證規則
$validate = new Validate([
'captcha|驗證碼'=>'require|captcha',
]);
//檢查驗證結果
if(!$validate->check($data)){
$this->assign('codeerror',$validate->getError());
}else{
$this->assign('codeerror',"驗證成功");
}
return $this->fetch("index");
/* $captcha=new \think\captcha\Captcha();
if(!$captcha->check($code)){
$this->error('驗證碼錯誤');
}else{
$this->success('驗證碼正確');
}*/
}
}
?>
好啦,現在可以提交一下檢驗成果。
看到輸出結果了沒有,這說明你已經成功了。