理論分析
image.png
image.png
1、實(shí)現(xiàn)驗(yàn)證碼底圖
image.png
$image = imagecreatetruecolor(100,300);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestory($image); // 銷毀資源
// output 瀏覽器輸出白色的圖片
2滔岳、實(shí)現(xiàn)數(shù)字驗(yàn)證碼
image.png
$image = imagecreatetruecolor(100,300);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
for($i=0;$i<4;$i++){
$fontsize=6; // 數(shù)字大小
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120)); // 數(shù)字顏色
$fontcontent = rand(0,9);
$x = ($i*100/4) + rand(5,10); // 第i個(gè)數(shù)字的x坐標(biāo)
$y = rand(5,10); // 第i個(gè)數(shù)字的y坐標(biāo)
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestory($image); // 銷毀資源
輸出
image.png
3杠娱、增加干擾元素
image.png
(1)、追加干擾點(diǎn)
$image = imagecreatetruecolor(100,300);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
// 加入四個(gè)數(shù)字
for($i=0;$i<4;$i++){
$fontsize=6; // 數(shù)字大小
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120)); // 數(shù)字顏色
$fontcontent = rand(0,9);
$x = ($i*100/4) + rand(5,10); // 第i個(gè)數(shù)字的x坐標(biāo)
$y = rand(5,10); // 第i個(gè)數(shù)字的y坐標(biāo)
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
// 追加干擾點(diǎn)
for ($i=0;$i<200;$i++){
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200)); // 干擾點(diǎn)顏色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestory($image); // 銷毀資源
輸出
image.png
(2)谱煤、追加干擾線
$image = imagecreatetruecolor(100,300);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
// 加入四個(gè)數(shù)字
for($i=0;$i<4;$i++){
$fontsize=6; // 數(shù)字大小
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120)); // 數(shù)字顏色
$fontcontent = rand(0,9);
$x = ($i*100/4) + rand(5,10); // 第i個(gè)數(shù)字的x坐標(biāo)
$y = rand(5,10); // 第i個(gè)數(shù)字的y坐標(biāo)
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
// 追加干擾點(diǎn)
for ($i=0;$i<200;$i++){
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200)); // 干擾點(diǎn)顏色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
// 追加干擾線
for ($i=0;$i<3;$i++){
$linecolor = imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220)); // 干擾線顏色
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestory($image); // 銷毀資源
輸出
image.png
4摊求、實(shí)現(xiàn)字母數(shù)字混合驗(yàn)證碼
image.png
<?php
/**
* Created by PhpStorm.
* User: zhengjiayuan
* Date: 2018/7/15
* Time: 22:19
*/
$image = imagecreatetruecolor(100,300);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
// 加入4個(gè)字母數(shù)字混合
for($i=0;$i<4;$i++){
$fontsize=6; // 數(shù)字大小
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120)); // 數(shù)字顏色
$data= 'abcdefghijkmnpqrstuvwxy3456789';
$fontcontent = substr($data,rand(0,strlen($data)),1);
$x = ($i*100/4) + rand(5,10); // 第i個(gè)字符的x坐標(biāo)
$y = rand(5,10); // 第i個(gè)字符的y坐標(biāo)
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
// 追加干擾點(diǎn)
for ($i=0;$i<200;$i++){
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200)); // 干擾點(diǎn)顏色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
// 追加干擾線
for ($i=0;$i<3;$i++){
$linecolor = imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220)); // 干擾線顏色
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestory($image); // 銷毀資源
輸出
image.png
5、通過(guò)session存儲(chǔ)驗(yàn)證信息
image.png
captcha.php
<?php
/**
* Created by PhpStorm.
* User: zhengjiayuan
* Date: 2018/7/15
* Time: 22:19
*/
session_start(); // 使用session
$image = imagecreatetruecolor(100,30);
// 為一副圖像分配顏色
$bgcolor = imagecolorallocate($image,255,255,255);
// 為區(qū)域填充顏色
imagefill($image,0,0,$bgcolor);
$captch_code = ''; // 保存驗(yàn)證碼信息
// 加入4個(gè)字母數(shù)字混合
for($i=0;$i<4;$i++){
$fontsize=6; // 數(shù)字大小
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120)); // 數(shù)字顏色
$data= 'abcdefhjkmnopqrstuvwxy345678';
$fontcontent = substr($data,rand(0,strlen($data)),1);
$captch_code .= $fontcontent;
$x = ($i*100/4) + rand(5,10); // 第i個(gè)字符的x坐標(biāo)
$y = rand(5,10); // 第i個(gè)字符的y坐標(biāo)
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
// 追加干擾點(diǎn)
for ($i=0;$i<200;$i++){
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200)); // 干擾點(diǎn)顏色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
// 追加干擾線
for ($i=0;$i<3;$i++){
$linecolor = imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220)); // 干擾線顏色
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
$_SESSION['authcode'] = $captch_code; // 保存驗(yàn)證碼信息到session 必須放在顯示圖片前 不然這句代碼不執(zhí)行
header('Content-type: image/png'); // 提前輸出圖片header信息
imagepng($image); // 瀏覽器輸出圖片
imagedestroy($image); // 銷毀資源
form.php
<?php
/**
* Created by PhpStorm.
* User: zhengjiayuan
* Date: 2018/7/15
* Time: 23:11
*/
if (isset($_REQUEST['authcode'])){
session_start();
if (strtolower($_REQUEST['authcode']) == $_SESSION['authcode']){
echo '<font color="#0000CC">輸入正確</font>';
}else{
echo '<font color="#0000CC">輸入錯(cuò)誤</font>';
}
exit();
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>確認(rèn)驗(yàn)證碼</title>
</head>
<body>
<form method="post" action="./form.php">
<p>驗(yàn)證碼圖片：<img src="./captcha.php?r=<?php echo rand()?>" border="1" width="100"></p>
<p>請(qǐng)輸入圖片中的內(nèi)容: <input type="text" name="authcode" value="" /></p>
<p><input type="submit" value="提交" style="padding: 6px 20px;"/></p>
</form>
</body>
</html>
image.png
image.png
6刘离、用JS實(shí)現(xiàn)動(dòng)態(tài)校驗(yàn)驗(yàn)證碼
image.png
<?php
/**
* Created by PhpStorm.
* User: zhengjiayuan
* Date: 2018/7/15
* Time: 23:11
*/
if (isset($_REQUEST['authcode'])){
session_start();
if (strtolower($_REQUEST['authcode']) == $_SESSION['authcode']){
echo '<font color="#0000CC">輸入正確</font>';
}else{
echo '<font color="#0000CC">輸入錯(cuò)誤</font>';
}
exit();
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>確認(rèn)驗(yàn)證碼</title>
</head>
<body>
<form method="post" action="./form.php">
<p>驗(yàn)證碼圖片：
<img id="captcha_img" src="./captcha.php?r=<?php echo rand()?>" border="1" width="100">
<!-- 實(shí)現(xiàn)動(dòng)態(tài)校驗(yàn)驗(yàn)證碼 -->
<a href="javasript:void(0)" onclick="document.getElementById('captcha_img').src='./captcha.php?r='+Math.random()">換一個(gè)室叉？</a>
</p>
<p>請(qǐng)輸入圖片中的內(nèi)容: <input type="text" name="authcode" value="" /></p>
<p><input type="submit" value="提交" style="padding: 6px 20px;"/></p>
</form>
</body>
</html>
