ThinkPHP5.1验证码详细解读

首先要保证你已经安装过Composer了,然后打开命令行执行以下语句

composer require topthink/think-captcha=2.0.*

这里有一个很多人不注意的坑,它的扩展包5.1版本的和5.0版本的是不同的命令安装,别安装错了,安错了不能使用,5.0版本的命令安装为如下命令
composer require topthink/think-captcha
安装好之后便可以进行下一步,我们来写个HTML代码,img标签里的src便是用来显示验证码的图片,一定要写对。在img里添加个id和onclick点击事件。

<div class="form-group">
	<label for="inputPassword3" class="col-sm-2 control-label">验证码</label>
		<div class="col-sm-3">
			<input type="text" class="form-control" name="verify" placeholder="验证码">
		</div>
			<img id="verify_img" src="{:captcha_src()}" style="width: 150px;" onclick="refreshVerify()">
</div>

接下来添加一段js代码用于刷新验证码,如下,完成之后验证码便可以通过点击刷新了,

<script>
	function refreshVerify() {
		var ts=Date.parse(new Date())/1000;//返回当前时间的事件戳除于1000
		$("#verify_img").attr("src","/captcha?rand="+ts);//刷新验证码
	}
</script>

验证验证码是否正确通过添加一个类继承validate类

写入便可以对验证码进行校验了。

 protected $rule = [
        'verify'  => 'require|captcha',
];
发布了15 篇原创文章 · 获赞 11 · 访问量 2801

猜你喜欢

转载自blog.csdn.net/YCarlos/article/details/91076117