php实现网页端验证码功能
2018-09-07 13:37
我们在实际开发中,会用到短信验证码以及网页验证码,相对来说网页验证码的成本比较低,安全系数也还可以,接下来我们就来做一个网页端的验证码,直接上代码:
首先来说一下文件目录结构:
----------phpyanzheng 项目文件夹
----fonttype 文件夹放字体文件,字体文件一般以.ttf和.otf结尾
----1.php 里面放php语言代码
----index.html 里面放网页布局
1.php
<?php header(content-type:image/jpeg);//定义一下代码以jpeg文件来解析 $width = 120;//定义了图像的宽 $height = 40;//定义了图像的高 $element = array(q,w,e,r,t,y,u,i,o,p,l,k,j,h,g,f,d,s,a,z,x, 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 ,S,D,F,G,H,J,K,L,M,N,B,V,C,X,Z);//定义一个显示文本的数组 $string = ; for($i=0;$i<4;$i++){ $string.=$element[rand(0,count($element)-1)];//随机产生四个文本目标 } $img = imagecreatetruecolor($width, $height);//设置验证区宽高 $colorBg = imagecolorallocate($img,rand(185,255),rand(185,255),rand(185,255));//产生200-255的随机数 $colorBorder = imagecolorallocate($img,rand(50,100),rand(50,100),rand(50,100));//边框颜色 $colorDian = imagecolorallocate($img,rand(0,100),rand(0,100),rand(0,100));//背景小点的颜色 $colorLine = imagecolorallocate($img,rand(0,255),rand(0,255),rand(0,255)); $colorString = imagecolorallocate($img,rand(20,80),rand(20,80),rand(20,80)); imagefill($img, 0, 0, $colorBg);//设置位置和背景颜色 imagerectangle($img,0,0,$width-1,$height-1,$colorBorder);//画一个边框 for($i=0;$i<200;$i++){//循环出200个干扰点 imagesetpixel($img, rand(0, $width-1), rand(0, $height-1), $colorDian); } for($i=0;$i<round(5);$i++){//循环出5条干扰线 imageline($img,rand(0,$width/2),rand(0,$height/2),rand($width/2,$width),rand($height/2,$height),$colorLine); } //imagestring($img, 4, 0, 0,a5dg, $colorString); imagettftext($img,25,rand(5, 15),rand(0,40),39,$colorString,fonttype/PrincetownStd.otf,$string); // 图像名称 字体大小 倾斜角度 起始位置X轴 起始位置Y轴 颜色 字体位置 显示的内容 imagejpeg($img);//输出图像 ?>
index.html
<!DOCTYPE html> <html> <head> <meta charset=UTF-8> <title>孙三峰--验证码</title> <script type=text/javascript src=js/jquery-1.1.0.js ></script> </head> <body> <!--注意:原文中对应的ip地址是自己电脑端ip,如果不能正常运行,请修改ip--> <p> <label class=lbright>验证码:</label> <span> <input type=text name=validcode style=width:70px; vertical-align:middle; id=validcode/> <img id=codePic src=看不清楚,换一张</span> <!----> </p> </body> <script type=text/javascript> function getPic(){ $(#codePic).attr(src,局部刷新--> }; </script> </html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
上一篇:上传多个文件的PHP脚本