thinkphp自带验证码
前端页面:
<div style="position:absolute;z-index:3;top:160px;left:180px;"> <img src="/static/imghwm/default1.png" data-src="{:U('Verify')}" class="lazy" style="max-width:90%" onclick="this.src=this.src+'?'+Math.random()" id="safecode" style="height:50px;width:70%;"/ alt="thinkphp verification code" ></div>
//验证码判断 public function Verify(){ ob_clean(); //显示验证码 $cfg=array( 'codeSet' => '0123456789', // 验证码字符集合 'imageH' => 25, // 验证码图片高度 'imageW' => 80, // 验证码图片宽度 'length' => 4, // 验证码位数 'fontttf' => '4.ttf', // 验证码字体,不设置随机获取 'fontSize' => 10, // 验证码字体大小(px) 'useNoise' => false, // 是否添加杂点 'useCurve' => false, // 是否画混淆曲线 'bg' => array(226,229,236) //背景颜色 ); $very=new \Think\Verify($cfg); $very->entry(); } //客户端通过ajax,实现校验验证码 public function checkVerify(){ $code = I('get.code'); $very = new \Think\Verify(); $key = $this->auth_my_code($very,$very->seKey); // 验证码不能为空 $secode = session($key); //对$code进行加密,在比较校验 if($this->auth_my_code($very,strtoupper($code)) == $secode['verify_code']) { echo json_encode(array('flag'=>1,'cont'=>'验证码正确')); }else{ echo json_encode(array('flag'=>2,'cont'=>'验证码错误')); } } private function auth_my_code($vry,$str){ $key = substr(md5($vry->seKey), 5, 8); $str = substr(md5($str), 8, 10); return md5($key . $str); }
以上验证码如果输入错误提交后不能自动刷新,对代码进行更改后:
location.href="/Login/Login";这样只能对整个页面刷新,提交表单的值可能会丢失,非常影响用户体验。
2.如果验证码输入错误,提交后自动刷新验证码。
else{ $('#safecode').attr("src","/Login/Verify?"+Math.random()); NewAlert(2,"验证码有误,请重新输入",null); code_ok = false; $('#verifyresult').html(msg.cont).css({'color':'red','font-size':'12px'}); }
3.以下为ajax提交验证码到后台校验:
<script type="text/javascript"> $("#login_btn").click(function(){ var username = $.trim($("#username").val()); var password = $.trim($("#password").val()); var code = $('#veri').val(); if(username == ""){ NewAlert(2,"请输入用户名",null); shutdown(); return false; }else if(password == ""){ NewAlert(2,"请输入密码",null); shutdown(); return false; }else if(code==''){ NewAlert(2,"请输入验证码",null); return false; } //ajax去服务器端校验 $.ajax({ url:"__CONTROLLER__/checkVerify", data:{'code':code}, dataType:'json', success:function(msg){ if(msg.flag==1){ var data= { username:username, password:password }; $.ajax({ type:"POST", url:"{:U('Login/Login')}", data:data, dataType:"json", success:function(msg){ if(msg.RespCode=='000'){ shutdown(); if(msg.org_code=='fcb'){ location.href="/Invest/index?biao_type=cwb"; }else{ location.href="{$Think.config.VIP_URL}/Individual/index"; } }else{ NewAlert(2,msg.RespDesc,null); return false; } }, error:function(){ shutdown(); }, beforeSend: function() { Loading(); }, }); }else{ $('#safecode').attr("src","/Login/Verify?"+Math.random()); NewAlert(2,"验证码有误,请重新输入",null); code_ok = false; $('#verifyresult').html(msg.cont).css({'color':'red','font-size':'12px'}); } } }); }); </script>
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article
R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
1 months agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
1 months agoBy尊渡假赌尊渡假赌尊渡假赌
Assassin's Creed Shadows: Seashell Riddle Solution
3 weeks agoByDDD
What's New in Windows 11 KB5054979 & How to Fix Update Issues
2 weeks agoByDDD
Will R.E.P.O. Have Crossplay?
1 months agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

WebStorm Mac version
Useful JavaScript development tools

SublimeText3 Linux new version
SublimeText3 Linux latest version

Atom editor mac version download
The most popular open source editor

SublimeText3 English version
Recommended: Win version, supports code prompts!

SAP NetWeaver Server Adapter for Eclipse
Integrate Eclipse with SAP NetWeaver application server.