php 验证码

    我们在实际开发中,会用到短信验证码以及网页验证码,相对来说网页验证码的成本比较低,安全系数也还可以,接下来我们就来做一个网页端的验证码,直接上代码:

首先来说一下文件目录结构:

    |----------phpyanzheng 项目文件夹

      |----fonttype 文件夹放字体文件,字体文件一般以 .ttf和.otf结尾

      |----1.php 里面放php语言代码

      |----index.html 里面放网页布局

1.php

 1 <?php
 2     header('content-type:image/jpeg');//定义一下代码以jpeg文件来解析
 3     $width = 120;//定义了图像的宽
 4     $height = 40;//定义了图像的高
 5     $element = array('q','w','e','r','t','y','u','i','o','p','l','k','j','h','g','f','d','s','a','z','x',
 6     'c','v','b','n','m','1','2','3','4','5','6','7','8','9','0','Q','W','E','R','T','Y','U','I','O','P','A'
 7     ,'S','D','F','G','H','J','K','L','M','N','B','V','C','X','Z');//定义一个显示文本的数组
 8     $string = '';
 9     for($i=0;$i<4;$i++){
10         $string.=$element[rand(0,count($element)-1)];//随机产生四个文本目标
11     }
12     $img = imagecreatetruecolor($width, $height);//设置验证区宽高
13     $colorBg = imagecolorallocate($img,rand(185,255),rand(185,255),rand(185,255));//产生200-255的随机数
14     $colorBorder = imagecolorallocate($img,rand(50,100),rand(50,100),rand(50,100));//边框颜色
15     $colorDian = imagecolorallocate($img,rand(0,100),rand(0,100),rand(0,100));//背景小点的颜色
16     $colorLine = imagecolorallocate($img,rand(0,255),rand(0,255),rand(0,255));
17     $colorString = imagecolorallocate($img,rand(20,80),rand(20,80),rand(20,80));
18     imagefill($img, 0, 0, $colorBg);//设置位置和背景颜色
19     imagerectangle($img,0,0,$width-1,$height-1,$colorBorder);//画一个边框
20     for($i=0;$i<200;$i++){//循环出200个干扰点
21         imagesetpixel($img, rand(0, $width-1), rand(0, $height-1), $colorDian);
22     }
23     for($i=0;$i<round(5);$i++){//循环出5条干扰线
24         imageline($img,rand(0,$width/2),rand(0,$height/2),rand($width/2,$width),rand($height/2,$height),$colorLine);
25     }
26     //imagestring($img, 4, 0, 0,'a5dg', $colorString);
27     
28     imagettftext($img,25,rand(5, 15),rand(0,40),39,$colorString,'fonttype/PrincetownStd.otf',$string);
29     //        图像名称    字体大小 倾斜角度 起始位置X轴 起始位置Y轴 颜色 字体位置 显示的内容
30     imagejpeg($img);//输出图像
31 ?>

index.html

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>孙三峰--验证码</title>
 6         <script type="text/javascript" src="js/jquery-1.1.0.js" ></script>
 7     </head>
 8     <body>
 9         <!--注意:原文中对应的ip地址是自己电脑端ip,如果不能正常运行,请修改ip-->
10         <p>
11             <label class="lbright">验证码:</label>  
12             <span>  
13                 <input type="text" name="validcode"  />  
14                 <img  src="http://192.168.1.113:8601/PHP/phpyanzheng/1.php" width="120" height="40"/>                   
15             </span>                 
16             <span  onclick="getPic();">看不清楚,换一张</span>  <!---->
17         </p>          
18     </body>
19     <script type="text/javascript">  
20          function getPic(){  
21                   $("#codePic").attr("src","http://192.168.1.113:8601/PHP/phpyanzheng/1.php?flag="+Math.random());  <!--局部刷新--> 
22           };  
23     </script>
24 </html>