驗證碼的使用,tp5.02自帶了一個驗證碼類,在我的項目中我是這樣用的,官方手冊中已經說的很詳細了,下面請看具體文件;
login.html模板
<form action="login" method="post">
<ul>
<li><span class="glyphicon glyphicon-user"> </span> <input type="text" name="username" placeholder="賬號"></li>
<li><span class="glyphicon glyphicon-lock"> </span> <input type="password" name="password" placeholder="密碼"></li>
<li><span class="glyphicon glyphicon-envelope"></span> <input class="verify" type="text" name="verify" placeholder="驗證碼"><div class="verify v-img">{:captcha_img()}</div></li>
<li><input class="btn btn-info sub" type="submit" value="登錄"></li>
</ul>
</form>
這是login.html表單部分,其中驗證碼的引入可以用兩種方式
<div>{:captcha_img()}</div>
或者
<div><img src="{:captcha_src()}" alt="captcha" /></div>
我采用了第一種方式,兩種方式隨意選擇;
點擊更換驗證碼,我寫在了外部js里面
login.html引用了jquery3.0.1
<script src="/js/jquery-3.1.0.min.js"></script>
說到這里,tp5.0.2,默認引用問public文件夾,不用再像tp3.2那樣用__PUBLIC__的方式,直接把js,cs,img等文件夾放入public文件夾中就可以了,我是前端界面的css,js等內容放在了public文件夾下,后臺的js,css文件放在了public文件夾下面的static文件夾中,例如如果要引用static文件中的js文件;
就要這樣寫<script src="/static/js/login.js"></script>;如果寫成"./static.js/...“ 前面多個點;引用則不成功;
tp5.0.2還有另一種寫法;這里暫時不做介紹,引入模板的時候會細說;
點擊切換驗證碼的js我寫在了login.js文件中
$(function() {
//驗證碼更換
var img = $('.v-img').find('img');
img.click(function() {
var src = img.attr('src');
src = src.substr(0,8) + '/' + Math.random();
$(this).attr('src', src);
// console.log(src);
})
})
表單提交的處理方法,寫在了本控制器Index的login方法中,具體index.php控制器內容:
<?php
namespace app\admin\controller;
class Index extends Common {
/*
* 首頁
*/
public function index(){
p('你好');
}
/*
* 登錄
*/
public function login() {
if (request()->isPost()) {
$captcha = input('post.verify')?input('post.verify'):$this->error('請輸入驗證碼');
if(!captcha_check($captcha)){
$this->error('驗證碼錯誤');
}else{
return '驗證碼正確:'. $captcha;
};
}else{
return view();
}
}
}
tp5.0.2中,用助手函數request()->isPost();判斷是否為post方式提交;
類比就知道request()->isGet();request()->isAjax();為判斷get方式和ajax方式;其他具體可以查看手冊詳細了解;
input(),可以理解為tp3.2中的 I 函數;
今天暫時寫到這里,如果有錯誤的地方,請指正,我會進款把整個項目寫完,覺得有用的地方分享到這里。