在網站開發中為了提供用戶體驗我們多數都使用ajax來做一些操作，下面我來介紹一個利用ajax實現無刷新頁面的驗證碼ajax驗證有需要的朋友可參考。
驗證碼生成程序我這裡就不介紹了，大家可參考http://www.bKjia.c0m/phper/phpanqn/46698.htm 下面介紹一個簡單的
代碼如下 復制代碼<?php
session_start();
//設置: 你可以在這裡修改驗證碼圖片的參數
$image_width = 120;
$image_height = 40;
$characters_on_image = 6;
$font = './monofont.ttf';
//以下字符將用於驗證碼中的字符
//為了避免混淆去掉了數字1和字母i
$possible_letters = '23456789bcdfghjkmnpqrstvwxyz';
$random_dots = 10;
$random_lines = 30;
$captcha_text_color="0x142864";
$captcha_noice_color = "0x142864";
$code = '';
$i = 0;
while ($i < $characters_on_image) {
$code .= substr($possible_letters, mt_rand(0, strlen($possible_letters)-1), 1);
$i++;
}
$font_size = $image_height * 0.75;
$image = @imagecreate($image_width, $image_height);
/* 設置背景、文本和干擾的噪點 */
$background_color = imagecolorallocate($image, 255, 255, 255);
$arr_text_color = hexrgb($captcha_text_color);
$text_color = imagecolorallocate($image, $arr_text_color['red'],
$arr_text_color['green'], $arr_text_color['blue']);
$arr_noice_color = hexrgb($captcha_noice_color);
$image_noise_color = imagecolorallocate($image, $arr_noice_color['red'],
$arr_noice_color['green'], $arr_noice_color['blue']);
/* 在背景上隨機的生成干擾噪點 */
for( $i=0; $i<$random_dots; $i++ ) {
imagefilledellipse($image, mt_rand(0,$image_width),
mt_rand(0,$image_height), 2, 3, $image_noise_color);
}
/* 在背景圖片上，隨機生成線條 */
for( $i=0; $i<$random_lines; $i++ ) {
imageline($image, mt_rand(0,$image_width), mt_rand(0,$image_height),
mt_rand(0,$image_width), mt_rand(0,$image_height), $image_noise_color);
}
/* 生成一個文本框，然後在裡面寫生6個字符 */
$textbox = imagettfbbox($font_size, 0, $font, $code);
$x = ($image_width - $textbox[4])/2;
$y = ($image_height - $textbox[5])/2;
imagettftext($image, $font_size, 0, $x, $y, $text_color, $font , $code);
/* 將驗證碼圖片在HTML頁面上顯示出來 */
header('Content-Type: image/jpeg');
// 設定圖片輸出的類型
imagejpeg($image);
//顯示圖片
imagedestroy($image);
//銷毀圖片實例
$_SESSION['6_letters_code'] = $code;
function hexrgb ($hexstr) {
$int = hexdec($hexstr);
return array( "red" => 0xFF & ($int >> 0x10),
"green" => 0xFF & ($int >> 0x8),
"blue" => 0xFF & $int
);
}
?>
驗證碼
生成後，我們要在實際的項目中應用，通常我們使用ajax可以實現點擊驗證碼時刷新生成新的驗證碼（有時生成的驗證碼肉眼很難識別），即“看不清換一張”。填寫驗證碼後，還需要驗證所填驗證碼是否正確，驗證的過程是要後台程序來完成，但是我們也可以通過ajax來實現無刷新驗證。
驗證驗證碼正確或錯誤的方法
驗證碼圖片上的文字被存放到了SESSION 變量裡面，驗證的時候，我們需要將SESSION 裡面的值和用戶輸入的值進行比較即可。
$_SESSION[6_letters_code] – 存放著驗證碼的文字值
$_POST[6_letters_code] – 這是用戶輸入的驗證碼的內容
我們建立一個前端頁面index.html，載入jquery，同時在body中加入驗證碼表單元素：
<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"></p>
<p><input type="button" class="btn" id="chk_num" value="提交" /></p>
html代碼中，<img src="code_num.php"即調用了生成的驗證碼，當點擊驗證碼時，刷新生成新的驗證碼：
代碼如下 復制代碼$(function(){
//數字驗證
$("#getcode_num").click(function(){
$(this).attr("src",'code_num.php?' + Math.random());
});
...
});
刷新驗證碼，其實就是重新請求了驗證碼生成程序，這裡要注意的是調用code_num.php時要帶上隨機參數防止緩存。接下來填寫好驗證碼之後，點“提交”按鈕，通過$.post()，前端向後台chk_code.php發送ajax請求。
代碼如下 復制代碼$(function(){
...
$("#chk_num").click(function(){
var code_num = $("#code_num").val();
$.post("chk_code.php?act=num",{code:code_num},function(msg){
if(msg==1){
alert("驗證碼正確！");
}else{
alert("驗證碼錯誤！");
}
});
});
});
後台chk_code.php驗證：
session_start();
$code = trim($_POST['code']);
if($code==$_SESSION["helloweba_num"]){
echo '1';
}
後台根據提交的驗證碼與保存在session中的驗證碼比對，完成驗證。
