快捷導(dǎo)航

基于php實(shí)現(xiàn)的驗(yàn)證碼小程序

更新時(shí)間：2016年12月13日 16:43:51 作者：xnn2016

本文主要介紹了基于php實(shí)現(xiàn)的驗(yàn)證碼小程序的具體實(shí)現(xiàn)方法，并做了詳細(xì)注釋，有利于理解與學(xué)習(xí)，需要的朋友一起來(lái)看下吧

驗(yàn)證碼功能(個(gè)人理解):

減輕服務(wù)器的壓力（如12306的驗(yàn)證碼功能）；
防止暴力注冊(cè)

個(gè)人思路:在a-z，A-Z，1-9生成n位隨機(jī)的數(shù)來(lái)構(gòu)成新的驗(yàn)證碼。

關(guān)于生成驗(yàn)證碼的幾個(gè)小函數(shù)

range() //指定范圍輸出一個(gè)數(shù)組
a)       如: range(1,9)
array_merge()//合并數(shù)組
a)       array_merge(數(shù)組1,數(shù)組2….)
array_rand(數(shù)組,數(shù)量)
a)       隨機(jī)從數(shù)組中取出幾個(gè)下標(biāo)返回一個(gè)數(shù)組

shuffle(數(shù)組)//將再一次打亂數(shù)組中元素
mt_rand(指定一個(gè)范圍) //生成一個(gè)更好的隨機(jī)數(shù)
如: mt_rand(1,5) //生成一個(gè)在1-5之間的任意數(shù)

生成驗(yàn)證碼代碼

<?php
 $arr1=range('a', 'z');//指定范圍輸出一個(gè)數(shù)組
 $arr2=range('A', 'Z');
 $arr3=range(1,9);
 $arr=array_merge($arr1,$arr2,$arr3); //合并數(shù)組
 $index = array_rand($arr,5); //在$arr中隨機(jī)取5個(gè)數(shù)，返回值是$arr的下標(biāo)
 Shuffle($index);
 $code = '';//定義一個(gè)空的字符串來(lái)存儲(chǔ)生成的驗(yàn)證碼用'點(diǎn)'來(lái)進(jìn)行拼接
 foreach ($index as $key => $value) {//遍歷數(shù)組
 $code.= $arr[$value];//根據(jù)下標(biāo)取數(shù)組中的值
 }
 var_dump($code);
?>

運(yùn)行結(jié)果截圖

完善：要把驗(yàn)證碼添加到圖像中這樣的驗(yàn)證碼才逼真

在完善之前先介紹有關(guān)圖像創(chuàng)建的大致步驟

創(chuàng)建圖像

方法一: 創(chuàng)建一個(gè)真彩色圖像 (空畫布)

imagecreatetruecolor(width, height) //創(chuàng)建一個(gè)真彩色圖像

說(shuō)明:

width : 畫布的寬度(像素)
height: 畫布的高度(像素)
返回值為圖像資源

注意：

為真彩色圖像: 填充顏色

imagefill(image, x, y, color) //為圖像資源填充顏色

說(shuō)明:

image //圖像資源
x,y,填充的坐標(biāo)點(diǎn)(注意:填充的與此點(diǎn)最接近的顏色)
color; //用什么顏色來(lái)填充

為真彩色圖像: 分配顏色

imagecolorallocate(image, red, green, blue)

說(shuō)明:

image //圖像資源
red: //紅顏色(0-255) 或 0x(00-ff) //即十六進(jìn)制來(lái)表示 (0xff就是255)
green//綠顏色(0-255)
blue //藍(lán)顏色(0-255)

imagefill和imagecolorallocate的代碼演示

在沒有給畫布填充顏色時(shí)的效果

給畫布填充顏色時(shí)的效果和代碼

<?php
//創(chuàng)建圖像資源(空白畫布)默認(rèn)顯示為黑色
$image = imagecreatetruecolor(300, 400);
//1.image //圖像資源
//2.red: //紅顏色(0-255) 或 0x(00-ff) //即十六進(jìn)制來(lái)表示 (0xff就是255)
//3.green//綠顏色(0-255)
//4.blue //藍(lán)顏色(0-255)
$color = imagecolorallocate($image, 255, 0, 0);
//1.image //圖像資源
//2.x,y,填充的坐標(biāo)點(diǎn)(注意:填充的與此點(diǎn)最接近的顏色)
//3.color; //用什么顏色來(lái)填充
imagefill($image, 0, 0, $color);
//輸出圖像
header('content-type:image/jpeg');
imagejpeg($image);
//銷毀圖像資源
imagedestroy($image);
?>

結(jié)果截圖；

輸出圖像（以jpeg為例）

輸出圖像到瀏覽器

a) header('content-type:image/jpeg'); //設(shè)置將圖像通過(guò)瀏覽來(lái)查看

b) imagejpeg(圖像資源)

按文件進(jìn)行輸出圖像

a) imagejpeg(圖像資源,'圖像路徑',圖像的質(zhì)量) //質(zhì)量取值0-100

b) 注意:

注意：只能jpeg格式才有質(zhì)量這個(gè)參數(shù).

銷毀圖像

imagedestroy($image); //銷毀圖像,釋放內(nèi)存資源.

注意: 當(dāng)前生成幾個(gè)圖像資源,就銷毀幾個(gè).

驗(yàn)證碼的整個(gè)代碼：

<?php
//實(shí)例:讓文本居于圖像的正中
//創(chuàng)建圖像資源(空白的畫布)
$image = imagecreatetruecolor(100, 50);
$color = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));
//為圖像資源填充顏色
imagefill($image, 0, 0, $color);
//繪制圖像
$font = 5;
//驗(yàn)證碼的開始
$arr1 = range('a','z');
$arr3 = range('A','Z');
$arr2 = range(1,9);
//array_merge — 合并一個(gè)或多個(gè)數(shù)組
$arr = array_merge($arr1,$arr2,$arr3);
$index = array_rand($arr,5); //隨機(jī)從原數(shù)組中找出5個(gè)下標(biāo)
$string = '';
foreach ($index as $value) { //$value 兩個(gè)功能,即是$index中的值,又是$arr中的下標(biāo)
 $string .= $arr[$value]; //將得到字符進(jìn)行連接
}
//驗(yàn)證碼的結(jié)束
//mt_rand — 生成更好的隨機(jī)數(shù)
//echo mt_rand(1,5);die;
//加入點(diǎn)干擾
$pointcolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));
//循環(huán)創(chuàng)建1000個(gè)干擾點(diǎn)
for ($i=0; $i <1000 ; $i++) {
 imagesetpixel($image, mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)), $pointcolor);
}
//加入線的干擾
$lintecolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));
// 循環(huán)創(chuàng)建50個(gè)線干擾
for ($i=0; $i <50 ; $i++) {
 imageline($image, mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)), mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)) ,$lintecolor);
}
//一個(gè)字符的寬度 imagefontwidth($font)
//字符串的個(gè)數(shù): strlen(字符串)
//一個(gè)字符的寬度*字符串的個(gè)數(shù)
//所有字符串寬度和= 一個(gè)字符的寬度*字符串的個(gè)數(shù)
//$x = (畫布的寬度-所有字符串寬度和)/2
$x = (imagesx($image)-imagefontwidth($font)*strlen($string))/2;
//$y = (畫布的高度-字符的高度)/2;
//字符的高度: imagefontheight($font)
$y = (imagesy($image)-imagefontheight($font))/2;
$stringcolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));
imagestring($image, $font, $x, $y, $string, $stringcolor);
//輸出圖像
header('content-type:image/jpeg'); //設(shè)置將圖像通過(guò)瀏覽來(lái)查看
imagejpeg($image,'',100); //將圖像資源輸出
//銷毀圖像資源
imagedestroy($image); //銷毀圖像

理解代碼中的一些函數(shù)

加入干擾的點(diǎn)

imagesetpixel(image, x, y, color)

說(shuō)明:x,y 一個(gè)點(diǎn)的坐標(biāo)

加入干擾的線

imageline(image, x1, y1, x2, y2, color)

說(shuō)明: x1,y1是線的一個(gè)端點(diǎn)坐標(biāo); x2,y2是線的另一個(gè)端口的坐標(biāo); 由兩點(diǎn)畫一條線

讓驗(yàn)證碼居于圖像的正中

imagefontheight(font)獲取字體的高度:
imagefontwidth(font)獲取字體的寬度:
strlen(字符串)//獲取字符串的長(zhǎng)度
imagesx(image) //獲取畫布的寬度
imagesy(image) //獲取畫布的高度

最后運(yùn)行結(jié)果

再次完善（和html代碼結(jié)合起來(lái)）

Html代碼

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form name='frm' method='post' action=''>
 <table width="30%" border="2" align="center" rules="all" cellpadding="10">
 <tr>
  <th colspan="2">請(qǐng)輸入信息</th>
 </tr>
 <tr>
  <th>姓名:</th>
  <th><input type="text" name="username"></input></th>
 </tr>
 <tr>
  <th>密碼:</th>
  <th><input type="password" name="userpwd"></input></th>
 </tr>
 <tr> 555556
  <th>驗(yàn)證碼</th>
  <th><input type = 'text' name = 'checkcode'></input><img src="21.php" style="cursor:pointer" onclick="this.src='21.php'?+Math.random()"></th>
 </tr>
 <tr>
  <th colspan="2"><input type="submit" name="submit" value="提交"></input></th>
 </tr>
</table>
</form>
</body>
</html>

理解；