Thinkphp verification code implementation (form, ajax implementation verification)

Thinkphp verification code implementation (form, ajax implementation verification)_php example

WBOY

Release： 2016-08-17 13:02:37

Original

1186 people have browsed it

Two verification code verification implementations, one is to implement verification directly on the form form submit button, and the other is to use ajax to pass parameters to implement verification:

1. To implement verification directly on the form submit button, write the following code in the controller VerifyController.class.php:

namespace Home\Controller;
use Think\Controller;
class VerifyController extends Controller {
public function index() {
$this->display();
}
public function checkLogin() {
$verify=new \Think\Verify();
$code=I('post.verify');//表单验证码
if($verify->check($code)){
$this->success('验证码正确');
}else{
$this->error('验证码错误');
}
}
public function verify()
{
// 实例化Verify对象
$verify = new \Think\Verify();
// 配置验证码参数
$verify->fontSize = 14; // 验证码字体大小
$verify->length = 4; // 验证码位数
$verify->imageH = 34; // 验证码高度
$verify->useImgBg = true; // 开启验证码背景
$verify->useNoise = false; // 关闭验证码干扰杂点
$verify->entry();
}
}

Copy after login

The code in the view Verify/index.html is as follows:

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<form action="{:U('verify/checkLogin')}" method="post">
<div class="form-group has-feedback">
<input type="text" name="verify" id="verify" placeholder="验证码" style="width:100px;" />
<span style="right:120px;"></span>
<img class="verify" src="{:U(verify)}" alt="验证码" onClick="this.src=this.src+'&#63;'+Math.random()" />
</div>
<div class="col-xs-4">
<button type="submit" >验证</button>
</div>
</form>
</body>
</html>

Copy after login

2. Use ajax to pass parameters for verification. The code in the controller VerifyController.class.php is as follows:

namespace Home\Controller;
use Think\Controller;
class VerifyController extends Controller {
public function index() {
$this->display();
}
public function checkLogin() {
$verify=new \Think\Verify();
$code=$_POST['code'];//ajax验证码获取
if($verify->check($code)){
$this->ajaxReturn(1);
}else{
$this->ajaxReturn(0);
}
}
public function verify()
{
// 实例化Verify对象
$verify = new \Think\Verify();
// 配置验证码参数
$verify->fontSize = 14; // 验证码字体大小
$verify->length = 4; // 验证码位数
$verify->imageH = 34; // 验证码高度
$verify->useImgBg = true; // 开启验证码背景
$verify->useNoise = false; // 关闭验证码干扰杂点
$verify->entry();
}
}

Copy after login

The code in the view Verify/index.html is as follows:

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="__JS__/jquery-2.1.0.min.js" ></script>
</head>
<body>
<form action="{:U('verify/checkLogin')}" method="post">
<div class="form-group has-feedback">
<input type="text" name="verify" id="verify" placeholder="验证码" style="width:100px;" />
<span style="right:120px;"></span>
<img class="verify" src="{:U(verify)}" alt="验证码" onClick="this.src=this.src+'&#63;'+Math.random()" />
</div>
<div class="col-xs-4">
<button type="button" id="ver">验证</button>
</div>
</form>
<script>
$(document).ready(function(){
/*ajax验证码*/
$("#ver").click(function(){
var code=$("#verify").val();//获取输入验证码
var url=$('form').attr('action');//获取表单action的值
$.ajax({
type:"post",
url:url,
data:{"code":code},
error:function(request){
alert("ajax错误");
},
success:function(data){
if(data){
alert("正确")
}else{
alert('错误')
}
}
});
});
});
</script>
</body>
</html>

Copy after login

In the second method, don’t forget to download the jquery.min.js file download address: http://www.jq22.com/jquery-info122

Configure the address in the configuration file Common/conf/config.php:

return array( 
/*地址替换*/
'TMPL_PARSE_STRING'=>array( 
'__JS__'=>__ROOT__.'/Public/JS',
),
);

Copy after login

The above is the implementation of thinkphp verification code (verification using form and ajax) introduced by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank everyone for your support of the Script House website!