实现验证码生成,验证过程;
分为三个部分:
1)php验证码生成;
2)html表单提交AJAX部分;
3)php验证码检验;
首先要知道,表单信息上交到服务器并存储在里面,方便用户随后调用,不过这临时的,所以可以用PHP的SESSION机制来实现,
用户在把数据存储到SESSION之前必须启动会话,要用到的函数:session_start();
**************************文件名:identify.php******************************//生成验证码:
<?PHP
session_start();
//****************定义参数
$num =4 ; //随机数字符串的长度
$w = 80; //画布的宽高
$h = 28;
$str = "2345678abcdefghijkmnpqrstuvwxyz"; //字符串
$code = "";
//*****************生成随机字符串
for($i=0;$i<$num;$I++){
$code .=$str[mt_rand(0,strlen($str))]; //注意这里用"."来将每个字符串连接起来;
}
//*****************将验证码写入SESSION以便验证时取用
$_SESSION["codes"] = $code;
Header("Content_type:image/PNG"); //头部定义,因为最后生成的是个图片
//*****************定义画布参数
$im = imagecreate($w,$h);
$black = imagecolorrallocate($im,mt_rand(0,200),mt_rand(0,120),mt_rand(0,120)); //随机数和干扰点的颜色:RGB形式
$border = imagecolorrallocate($im,118,151,199);//边框颜色
$bgcolor = imagecolorrallocate($im,235,236,237);//背景颜色
//******************开始画布操作,用的是GD库的函数
imagefilledreatangle($im,0,0,$w,$h,$bgcolor); //背景区域:imagefilledreatangle($im,起始x轴,起始y轴,x轴结束,y轴结束,背景颜色值参数)
imagerectangle($im,0,0,$w-1,$h-1,$border); //边框区域,注意这里的$w-1和$h-1,因为边框是1px.
//干扰点
for($i=0;$i<80;$i++){
imagesetpixel($im,rand(0,$w),rand(0,$h),$black); //rand(0,$w),rand(0,$h)是横纵坐标;
}
//*******************字符画在画布上,每个字符要按照一定的水平间距和垂直间距来放置,避免完全重叠
$strx = rand(10,20);
for($i=0;$<$num;$i++){
$strpos = rand(1,6); //垂直间距
imagestring($im,5,$strx,$strpos,substr($code,$i,1),$black); //5是字体大小;
$strx += rand(10,20); //水平间距每个字符不一样
}
imagepng($im);
imagedestroy($im);
?>
<body>
<form>
请输入验证码:<input type="text" name="code_num" id="code_num">
<img src="identify.php" title="看不清?换一张" οnclick="this.src='identify.php?url='+Matn.random()" align="absmiddle">
<p id="showInfo"></p>
<a href="javascript:void(0);" id="subbtn">提交</a>
</form>
</body>
src="identify.php"可以将图片显示出来,onclick点击函数是看不清时,点击调用换一张,带上随机参数是为了防止缓存;
<p>标签是通过html显示验证结果
js部分:
$(function(){
$("#subbtn").click(function(){
var comcode = $("#code_num").val(); //获取imput的值;
$.post({ //Ajax动态显示页面
"match_com.php?act=num", //提交给验证PHP文件
{code:comcode}, //传送值过去
function(data){
if(data==ok){
$("#showInfo").html("验证码正确");
}else{
$("#showInfo").html("验证码错误");
}
});
});
});
最后的验证php文件:match_com.php
要从服务器端提取存储的数据,所以同样要开启session服务:
session_strat();
$code_num = $_POST['code'];
if($code_num == $_SESSION['codes']){ //之前有存在SESSION里,现在可以直接调用数据
echo "ok";
}
显示结果如下:
再具体写表单验证的验证JS/JQ函数就可以用啦。