ThinkPHP5验证码的实现
关于如何创建tp5的工程,本文就不在赘述,不懂的可以google查找相关内容,本文直接是在已经创建好的tp5环境进行实现的
如果已经安装 think-captcha扩展包,则跳过第一个步骤。
1.使用composer安装 think-captcha 扩展包
关于如何安装composer,可以访问网址进行正确安装。
使用cmd,切换到ThinkPHP的应用根目录下,执行:
composer require topthink/think-captcha
出现以下界面则表明安装成功:
说明:
如果出现以下错误:
表示本地下载ThinkPHP版本不支持默认下载的think-captcha版本,需要自己指定版本
composer require topthink/think-captcha=1.*
2.前端代码,文件名index.test.html,最为简单的方式,没有使用到css
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Test/title> 6 <script type="text/javascript"src="http://code.jquery.com/jquery-latest.js"></script> 7 </head> 8 <body> 9 <div class="codeImg"> 10 <img src="{:url('index/index/newCode',['t'=>time()])}" title="点击更换" alt="captcha" class="captcha_img" id="captcha_img" onclick="changeCode()"/> 11 </div> 12 <input type="text" id="code"> 13 <input type="button" id="submit" onclick="submitCode()" value="验证"> 14 <script> 15 function submitCode() { 16 // 获取用户输入的值 17 code = $("#code").val(); 18 // 使用ajax请求后台 19 $.ajax({ 20 type : "POST", 21 dataType:"json", 22 data:{ 23 'code':code 24 }, 25 url :"/index/index/verfycode", 26 success : function(rs) { 27 // 简单输出验证成功还是失败 28 alert(rs); 29 } 30 }); 31 } 32 // 用户点击验证码图片,改变验证码 33 function changeCode(){ 34 $("#captcha_img").attr("src",'{:url("index/index/newCode")}?t='+parseInt(40*Math.random())); 35 } 36 </script> 37 </body> 38 </html>
3.接下来是实现后端PHP代码
1 <?php 2 namespace app\index\controller; 3 use think\captcha\Captcha; 4 use think\Controller; 5 class Index extends Controller 6 { 7 public function test(){ 8 // 自动定位到 index.test.html 文件 9 // 具体config.php配置文件这里不细说 10 this->fetch(); 11 } 12 public function verfycode(){ 13 // 获取ajax请求的值 14 $code = input("code"); 15 // 进行验证码的验证 16 if (captcha_check($code)){ 17 return '验证成功'; 18 } else { 19 return '验证失败'; 20 } 21 } 22 public function newCode(){ 23 // 配置验证码的显示方式和内容 24 $config = [ 25 // 验证码位数 26 'length' => 4, 27 // 验证码过期时间 28 'expire' => 300, 29 // 是否添加杂点 30 'useNoise' => true, 31 // 是否画混淆曲线 32 'useCurve' => false, 33 // 是否使用背景图片 34 'useImgBg' => false, 35 // 使用字体 36 'fontttf' => '3.ttf' 37 ]; 38 $captcha = new Captcha($config); 39 return $captcha->entry(); 40 } 41 }
详细阐述验证码的配置: