The example in this article describes the click captcha click verification code class and its usage implemented in PHP, which is a very practical function. Share it with everyone for your reference. The details are as follows:
1. Demand:
Most of the commonly used form verification codes now require user input, but this will be inconvenient for mobile users.
If mobile users visit, they don’t need to enter it. Instead, they can click a certain location to confirm the verification code, which will be much more convenient.
2. Principle:
1. Use PHP imagecreate to create a PNG image, draw N arcs in the image, one of which is a complete circle (for verification), and record the center coordinates and radius into the session.
2. In the browser, when the user clicks on the verification code image, record the click location.
3. Compare the coordinates clicked by the user with the center coordinates and radius recorded in the session to determine whether it is in the circle. If so, the verification is passed.
The running effect of the program is as shown below:
3. Implementation method:
ClickCaptcha.class.php class file is as follows:
<?php /** Click Captcha 验证码类 * Date: 2013-05-04 * Author: fdipzone * Ver: 1.0 */ class ClickCaptcha { // class start public $sess_name = 'm_captcha'; public $width = 500; public $height = 200; public $icon = 5; public $iconColor = array(255, 255, 0); public $backgroundColor = array(0, 0, 0); public $iconSize = 56; private $_img_res = null; public function __construct($sess_name=''){ if(session_id() == ''){ session_start(); } if($sess_name!=''){ $this->sess_name = $sess_name; // 设置session name } } /** 创建验证码 */ public function create(){ // 创建图象 $this->_img_res = imagecreate($this->width, $this->height); // 填充背景 ImageColorAllocate($this->_img_res, $this->backgroundColor[0], $this->backgroundColor[1], $this->backgroundColor[2]); // 分配颜色 $col_ellipse = imagecolorallocate($this->_img_res, $this->iconColor[0], $this->iconColor[1], $this->iconColor[2]); $minArea = $this->iconSize/2+3; // 混淆用图象,不完整的圆 for($i=0; $i<$this->icon; $i++){ $x = mt_rand($minArea, $this->width-$minArea); $y = mt_rand($minArea, $this->height-$minArea); $s = mt_rand(0, 360); $e = $s + 330; imagearc($this->_img_res, $x, $y, $this->iconSize, $this->iconSize, $s, $e, $col_ellipse); } // 验证用图象,完整的圆 $x = mt_rand($minArea, $this->width-$minArea); $y = mt_rand($minArea, $this->height-$minArea); $r = $this->iconSize/2; imagearc($this->_img_res, $x, $y, $this->iconSize, $this->iconSize, 0, 360, $col_ellipse); // 记录圆心坐标及半径 $this->captcha_session($this->sess_name, array($x, $y, $r)); // 生成图象 Header("Content-type: image/PNG"); ImagePNG($this->_img_res); ImageDestroy($this->_img_res); exit(); } /** 检查验证码 * @param String $captcha 验证码 * @param int $flag 验证成功后 0:不清除session 1:清除session * @return boolean */ public function check($captcha, $flag=1){ if(trim($captcha)==''){ return false; } if(!is_array($this->captcha_session($this->sess_name))){ return false; } list($px, $py) = explode(',', $captcha); list($cx, $cy, $cr) = $this->captcha_session($this->sess_name); if(isset($px) && is_numeric($px) && isset($py) && is_numeric($py) && isset($cx) && is_numeric($cx) && isset($cy) && is_numeric($cy) && isset($cr) && is_numeric($cr)){ if($this->pointInArea($px,$py,$cx,$cy,$cr)){ if($flag==1){ $this->captcha_session($this->sess_name,''); } return true; } } return false; } /** 判断点是否在圆中 * @param int $px 点x * @param int $py 点y * @param int $cx 圆心x * @param int $cy 圆心y * @param int $cr 圆半径 * sqrt(x^2+y^2)<r */ private function pointInArea($px, $py, $cx, $cy, $cr){ $x = $cx-$px; $y = $cy-$py; return round(sqrt($x*$x + $y*$y))<$cr; } /** 验证码session处理方法 * @param String $name captcha session name * @param String $value * @return String */ private function captcha_session($name,$value=null){ if(isset($value)){ if($value!==''){ $_SESSION[$name] = $value; }else{ unset($_SESSION[$name]); } }else{ return isset($_SESSION[$name])? $_SESSION[$name] : ''; } } } // class end ?>
demo.php sample program is as follows:
<?php session_start(); require('ClickCaptcha.class.php'); if(isset($_GET['get_captcha'])){ // get captcha $obj = new ClickCaptcha(); $obj->create(); exit(); } if(isset($_POST['send']) && $_POST['send']=='true'){ // submit $name = isset($_POST['name'])? trim($_POST['name']) : ''; $captcha = isset($_POST['captcha'])? trim($_POST['captcha']) : ''; $obj = new ClickCaptcha(); if($obj->check($captcha)){ echo 'your name is:'.$name; }else{ echo 'captcha not match'; } echo ' <a href="demo.php">back</a>'; }else{ // html ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> Click Captcha Demo </title> <script type="text/javascript" src="jquery-1.6.2.min.js"></script> <script type="text/javascript"> $(function(){ $('#captcha_img').click(function(e){ var x = e.pageX - $(this).offset().left; var y = e.pageY - $(this).offset().top; $('#captcha').val(x+','+y); }) $('#btn').click(function(e){ if($.trim($('#name').val())==''){ alert('Please input name!'); return false; } if($.trim($('#captcha').val())==''){ alert('Please click captcha!'); return false; } $('#form1')[0].submit(); }) }) </script> </head> <body> <form name="form1" id="form1" method="post" action="demo.php" onsubmit="return false"> <p>name:<input type="text" name="name" id="name"></p> <p>Captcha:Please click full circle<br><img id="captcha_img" src="demo.php?get_captcha=1&t=<?=time() ?>" style="cursor:pointer"></p> <p><input type="submit" id="btn" value="submit"></p> <input type="hidden" name="send" value="true"> <input type="hidden" name="captcha" id="captcha"> </form> </body> </html> <?php } ?>
Click here to download the complete source code of this article.
I hope this article will be helpful to everyone’s PHP programming design.
You have to judge whether the verification code you filled in is consistent with the verification code you saved before
if($_POST["captcha"]!=$_SESSION["captcha"] )
{
echo "Verification code error";
}
If you mean Ajax-like effect, then you can use something like this: $captcha = new Zend_Captcha_Image(array(......));$id = $captcha->generate() ;echo \'\' . $captcha->render($view) . \'\';// .jsfunction changeCaptcha(){? ???......? ???document.getElementById(\ 'captcha\').innerHtml = ...}