php生成图片验证码-附五种验证码_PHP

WBOY
Release: 2016-05-30 08:47:05
Original
925 people have browsed it

以前输出验证码的时候用过一个方法,在前台用JS生成验证码字符串,再传递到后台用PHP输出验证码图像。这样在验证时就不需要使用$_SESSION传递验证码的值,直接用JS比较生成的字符串和输入的字符串是否相等即可。

本文以实例演示5种验证码,并介绍生成验证码的函数。PHP生成验证码的原理:通过GD库,生成一张带验证码的图片,并将验证码保存在Session中。

1、HTML

5中验证码HTML代码如下:

<div class="demo">


 <h3>1、数字验证码</h3>
 <p>验证码:<input type="text" class="input" id="code_num" name="code_num" maxlength="4" /> <img  src="code_num.php" id="getcode_num" title="看不清,点击换一张" align="absmiddle" / alt="php生成图片验证码-附五种验证码_PHP" ></p>
 <p><input type="button" class="btn" id="chk_num" value="提交" /></p>
 </div>
 <div class="demo">
Copy after login

 <h3>2、数字+字母验证码</h3>
 <p>验证码:<input type="text" class="input" id="code_char" maxlength="4" /> <img  src="code_char.php" id="getcode_char" title="看不清,点击换一张" align="absmiddle" / alt="php生成图片验证码-附五种验证码_PHP" ></p>
 <p><input type="button" class="btn" id="chk_char" value="提交" /></p>
 </div>
 <div class="demo">
Copy after login

 <h3>3、中文验证码</h3>
 <p>验证码:<input type="text" class="input" id="code_zh" maxlength="4" /> <img  src="code_zh.php" id="getcode_zh" title="看不清,点击换一张" align="absmiddle" / alt="php生成图片验证码-附五种验证码_PHP" ></p>
 <p><input type="button" class="btn" id="chk_zh" value="提交" /></p>
 </div>
 <div class="demo">
Copy after login

 <h3>4、仿google验证码</h3>
 <p>验证码:<input type="text" class="input" id="code_gg" maxlength="4" /> <img  src="code_gg.php" id="getcode_gg" title="看不清,点击换一张" align="absmiddle" / alt="php生成图片验证码-附五种验证码_PHP" ></p>
 <p><input type="button" class="btn" id="chk_gg" value="提交" /></p>
 </div>
 <div class="demo">
Copy after login

<h3>5、算术验证码</h3>
 <p>验证码:<input type="text" class="input" id="code_math" maxlength="4" /> <img  src="code_math.php" id="getcode_math" title="看不清,点击换一张" align="absmiddle" / alt="php生成图片验证码-附五种验证码_PHP" ></p>
 <p><input type="button" class="btn" id="chk_math" value="提交" /></p>
</div>
Copy after login

2、js验证

$(function() {
 $("#getcode_num").click(function() { //数字验证
 $(this).attr("src", 'code_num.php&#63;' + Math.random());
 });
 $("#chk_num").click(function() {
 var code_num = $("#code_num").val();
 $.post("chk_code.php&#63;act=num", {
  code: code_num
 },
 function(msg) {
  if (msg == 1) {
  alert("验证码正确!");
  } else {
  alert("验证码错误!");
  }
 });
 });
Copy after login

//数字+字母验证

 $("#getcode_char").click(function() {
 $(this).attr("src", 'code_char.php&#63;' + Math.random());
 });
 $("#chk_char").click(function() {
 var code_char = $("#code_char").val();
 $.post("chk_code.php&#63;act=char", {
  code: code_char
 },
 function(msg) {
  if (msg == 1) {
  alert("验证码正确!");
  } else {
  alert("验证码错误!");
  }
 });
 });
Copy after login

//中文验证码

 $("#getcode_zh").click(function() {
 $(this).attr("src", 'code_zh.php&#63;' + Math.random());
 });
 $("#chk_zh").click(function() {
 var code_zh = escape($("#code_zh").val());
 $.post("chk_code.php&#63;act=zh", {
  code: code_zh
 },
 function(msg) {
  if (msg == 1) {
  alert("验证码正确!");
  } else {
  alert("验证码错误!");
  }
 });
 });
Copy after login

//google验证

 $("#getcode_gg").click(function() {
 $(this).attr("src", 'code_gg.php&#63;' + Math.random());
 });
 $("#chk_gg").click(function() {
 var code_gg = $("#code_gg").val();
 $.post("chk_code.php&#63;act=gg", {
  code: code_gg
 },
 function(msg) {
  if (msg == 1) {
  alert("验证码正确!");
  } else {
  alert("验证码错误!");
  }
 });
 });
Copy after login

//算术验证

 $("#getcode_math").click(function() {
 $(this).attr("src", 'code_math.php&#63;' + Math.random());
 });
 $("#chk_math").click(function() {
 var code_math = $("#code_math").val();
 $.post("chk_code.php&#63;act=math", {
  code: code_math
 },
 function(msg) {
  if (msg == 1) {
  alert("验证码正确!");
  } else {
  alert("验证码错误!");
  }
 });
 });
});
Copy after login

3、PHP生成验证码

session_start();
getCode(4,60,20);
function getCode($num,$w,$h) {
 $code = "";
 for ($i = 0; $i < $num; $i++) {
 $code .= rand(0, 9);
 }
 //4位验证码也可以用rand(1000,9999)直接生成
 //将生成的验证码写入session,备验证时用
 $_SESSION["helloweba_num"] = $code;
 //创建图片,定义颜色值
 header("Content-type: image/PNG");
 $im = imagecreate($w, $h);
 $black = imagecolorallocate($im, 0, 0, 0);
 $gray = imagecolorallocate($im, 200, 200, 200);
 $bgcolor = imagecolorallocate($im, 255, 255, 255);
 //填充背景
 imagefill($im, 0, 0, $gray);
 //画边框
 imagerectangle($im, 0, 0, $w-1, $h-1, $black);
 //随机绘制两条虚线,起干扰作用
 $style = array ($black,$black,$black,$black,$black,
 $gray,$gray,$gray,$gray,$gray
 );
 imagesetstyle($im, $style);
 $y1 = rand(0, $h);
 $y2 = rand(0, $h);
 $y3 = rand(0, $h);
 $y4 = rand(0, $h);
 imageline($im, 0, $y1, $w, $y3, IMG_COLOR_STYLED);
 imageline($im, 0, $y2, $w, $y4, IMG_COLOR_STYLED);
 //在画布上随机生成大量黑点,起干扰作用;
 for ($i = 0; $i < 80; $i++) {
 imagesetpixel($im, rand(0, $w), rand(0, $h), $black);
 }
 //将数字随机显示在画布上,字符的水平间距和位置都按一定波动范围随机生成
 $strx = rand(3, 8);
 for ($i = 0; $i < $num; $i++) {
 $strpos = rand(1, 6);
 imagestring($im, 5, $strx, $strpos, substr($code, $i, 1), $black);
 $strx += rand(8, 12);
 }
 imagepng($im);//输出图片
 imagedestroy($im);//释放图片所占内存
}
Copy after login

以上内容就是php生成图片验证码-附五种验证码的全部内容,希望大家喜欢。

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template