图形验证码

最新推荐文章于 2024-07-16 09:00:00 发布

cyyjm

最新推荐文章于 2024-07-16 09:00:00 发布

阅读量690

点赞数

分类专栏： php javascript

本文链接：https://blog.csdn.net/cyyjm/article/details/9995527

版权

javascript 同时被 2 个专栏收录

10 篇文章 0 订阅

订阅专栏

php

5 篇文章 0 订阅

订阅专栏

最近公司网站搞个查询功能，上网找了些这方面的例子。简单分析下，可以用两种方法，一个是php生成图片，并写入session里，在服务器那边检验，一个是直接通过js验证，后台不需要验证这个。很多人说后一种很不安全，嗯，这是不太安全，但是我总觉得交给服务器检验很慢，而且体验不好。自己抛砖引玉吧。看看大家有没有更好的想法。我的例子也是很简单。没有使用到ajax 。

第一种：

需要3个页面:

index.php

<form method="post" action="tt.php">
<p>
  <textarea name="contents" cols="" rows=""></textarea>
</p>
<p> </p>
<p>
  <input type="text" name="muth" id="muth" /><img id="refresh" src="muth.php" οnclick="document.getElementById('refresh').src='lib/muth.php'"/>
</p>
<p> </p>
<p>
  <input type="submit" name="button" id="button" value="提交" />
</p>
</form>

muth.php

<?php 
session_start(); 
//生成验证码图片 
Header("Content-type: image/PNG"); 
$im = imagecreate(44,18); // 画一张指定宽高的图片 
$back = ImageColorAllocate($im, 245,245,245); // 定义背景颜色 
imagefill($im,0,0,$back); //把背景颜色填充到刚刚画出来的图片中 
$vcodes = ""; 
srand((double)microtime()*1000000); 
//生成4位数字 
for($i=0;$i<4;$i++){ 
$font = ImageColorAllocate($im, rand(100,255),rand(0,100),rand(100,255)); // 生成随机颜色 
$authnum=rand(1,9); 
$vcodes.=$authnum; 
imagestring($im, 5, 2+$i*10, 1, $authnum, $font); 
} 
$_SESSION['VCODE'] = $vcodes; 
for($i=0;$i<100;$i++) //加入干扰象素 
{ 
$randcolor = ImageColorallocate($im,rand(0,255),rand(0,255),rand(0,255)); 
imagesetpixel($im, rand()%70 , rand()%30 , $randcolor); // 画像素点函数 
} 
ImagePNG($im); 
ImageDestroy($im); 
?>

tt.php

<?php
	session_start();
	if($_SESSION['VCODE'] == $_POST['muth']){
		echo $_SESSION['VCODE'];
		echo '验证码输入正确';
	}else{
		echo '验证码输入不正确';
	}
?>

第二种方式：

也是三个页面

<html>
<head>
<meta http-equiv="pragma" content="no-cache">  
<meta http-equiv="cache-control" content="no-cache,must-revalidate">
<title>js---判断验证码码是否正确</title>
<script >
function yzm(form){
    var num1=Math.round(Math.random()*10000000);
    var num=num1.toString().substr(0,4);
    document.write("<img name=codeimg width=50 heigh=20 src='yzm.php?num="+num+"'>");
}
//刷新验证码
function code(form){
    var num1=Math.round(Math.random()*10000000);
    var num=num1.toString().substr(0,4);
    document.codeimg.src="yzm.php?num="+num;//这里面的num就是验证码的值
    
}
function checkYzm(form){
    var i = document.codeimg.src.slice(-4);
    if(form.check.value == ""){
        document.getElementById('result').innerHTML = "验证码不能为空";
    }else if(form.check.value != i){
        document.getElementById('result').innerHTML = "验证码错误，请重新输入";
    }else{
        document.getElementById('result').innerHTML = "验证码输入正确";
    }
}
function postForm(form) {
	var i = document.codeimg.src.slice(-4);
    if(form.check.value == "" || form.check.value != i)
	  {
	     document.getElementById('check').value = '';
         document.getElementById('check').focus();
	  }
	else 
	  {
	     form.submit();
	  }
}
</script>
 <style type="text/css">
 #result {height:240px;width:150px;background-color:red;}
  </style>
</head>
<body>
<form id="login" name="login" method="post" action="wow.php">
<table>
    <tr>
        <td  width="46" height="18">
            <input id="check" name="check" type="text" width="46" onBlur="return checkYzm(login)"  >
		</td>   
        <td width="52" height="18" onClick="javascript:code(login)">
		    <script>yzm(login);</script>
		</td>
    </tr>
	<tr>
	    <td colspan=2>
		    <input type="button" id="btnSubmit" name="btnSubmit" value="提交" οnclick="postForm(login)"/>
		</td>
	</tr>
</table>   
<div id="result"></div>

</form>
</body>
</html>

yzm.php

<?php
srand((double)microtime()*1000000);
$im=imagecreate(50,20); // 新建一个基于调色板的图像
$gray=imagecolorallocate($im,200,200,200);//imagecolorallocate -- 为一幅图像分配颜色
imagefill($im,0,0,$gray);  //imagefill -- 区域填充

for($i=0;$i<4;$i++){
 $str=mt_rand(1,3);
 $size=mt_rand(3,6);
 $authnum=substr($_GET['num'],$i,1);
 imagestring($im,$size,(2+$i*10),$str,$authnum,imagecolorallocate($im,rand(0,130),rand(0,130),rand(0,130)));
} //imagestring -- 水平地画一行字符串

imagepng($im);
imagedestroy($im);
?>

wow.php

<?php
echo "验证码输入正确!";
?>

cyyjm

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
图形验证码

最近公司网站搞个查询功能，上网找了些这方面的例子。简单分析下，可以用两种方法，一个是php生成图片，并写入session里，在服务器那边检验，一个是直接通过js验证，后台不需要验证这个。很多人说后一种很不安全，嗯，这是不太安全，但是我总觉得交给服务器检验很慢，而且体验不好。自己抛砖引玉吧。看看大家有没有更好的想法。我的例子也是很简单。没有使用到ajax 。第一种：需要3个页面:in
复制链接

扫一扫

专栏目录