php实现图形验证码详解!

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Aaroun/article/details/82843566

最近由于项目需要,图形验证码,就写了一个,为大家详细介绍下实现过程!

1、验证码封装实现方法

//生成验证码
	public function get_img_code(){
		ob_clean();
		cookie('code',NULL);
		session('code',NULL);				
	

		$code=$this->randStr(4);
		cookie('code',$code);
		session('code',$code);			
	
		
		$x_size=75;
		$y_size=30;		
		$aimg = imagecreate($x_size,$y_size);
		$back = imagecolorallocate($aimg,255, 255, 255);
		$border = imagecolorallocate($aimg,204,53,53);
		imagefilledrectangle($aimg, 10, 10, $x_size+1, $y_size+1, $back);
		imagerectangle($aimg,100,100, $x_size, $y_size, $border);
		imageString($aimg,30,20,8, $code,$border); 
		header("Pragma:no-cache");
		header("Cache-control:no-cache");
		header("Content-type: image/png");
		imagepng($aimg);
		imagedestroy($aimg);
	}	
	
	//生成随机字符串
	function rand_str($len){ 
		$chars = array( 
		"a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z", "A", "B","D", "E", "F", "G","H","J","L", "M", "N","Q", "R","T", "U","Y", "2","3", "4", "5", "6", "7", "8", "9" 
		); 
		$charsLen = count($chars)-1;  
		shuffle($chars);
		$outStr=''; 
		for ($i=0;$i<$len;$i++){
			$outStr.=$chars[mt_rand(0,$charsLen)]; 
		}
		return $out_str; 
	}

2.前端展示功能

<!-- 验证-->
    <div class="popup">
        <div class="popup_bg"></div>
        <div class="popup_content">
            <h1>完成图形验证码</h1>
            <div class="verify">
				<span type="hidden" id="hid"></span>
                <input placeholder="请输入图形验证码" type="text" id="icode" />
				<img id="vocde" src="/shop.php/System/getImgCode" alt=""/> 			
                <p onclick="getImgCode()">看不清,换一张</p>
                <span style="display: none;">您输入的验证码错误,请重新输入</span>
            </div>
        </div>
    </div>
<script type="text/javascript" src="__VIEW__Public/js/jQuery.v1.8.3.min.js"></script>
   <script>
	//图片验证码
	function getImgCode(){
		var verifyimg = $("#vocde").attr("src"); 
		if(verifyimg.indexOf('/?')==0){
	        $("#vocde").attr("src", verifyimg+'/?random='+Math.random());  
	    }else{  
	        $("#vocde").attr("src", verifyimg.replace(/\?.*$/,'')+'?random'+Math.random());  
	    }					
	}

//js 获取cookie
	function getCookie(c_name){
		if (document.cookie.length>0){
			  c_start=document.cookie.indexOf(c_name + "=")
			  if (c_start!=-1){ 
					c_start=c_start + c_name.length+1 
					c_end=document.cookie.indexOf(";",c_start)
					if (c_end==-1) c_end=document.cookie.length
					return unescape(document.cookie.substring(c_start,c_end))
				} 
		  }
		return "";
	}


//以下就是输入框的图形验证码和cookie中一致就表示通过
 //实现逻辑这里写

</script>

猜你喜欢

转载自blog.csdn.net/Aaroun/article/details/82843566
今日推荐