PHP Verification Code Ajax Verification implementation Method _php tutorial

Source: Internet
Author: User
In web development in order to provide user experience we mostly use Ajax to do some things, let me introduce an AJAX implementation of the non-refreshed page verification code AJAX verification of the needs of friends can be consulted.

Verification code Generator I do not introduce here, we can refer to http://www.bKjia.c0m/phper/phpanqn/46698.htm below to introduce a simple

The code is as follows Copy Code

Session_Start ();
Settings: You can change the parameters of the CAPTCHA image here
$image _width = 120;
$image _height = 40;
$characters _on_image = 6;
$font = './monofont.ttf ';

The following characters will be used for the characters in the verification code
To avoid confusion, remove the number 1 and the letter 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);

/* Set background, text, and noise of interference */
$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 ');

/* Randomly generate noise on the background */
for ($i =0; $i < $random _dots; $i + +) {
Imagefilledellipse ($image, Mt_rand (0, $image _width),
Mt_rand (0, $image _height), 2, 3, $image _noise_color);
}

/* Randomly generate lines on the background image */
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);
}

/* Generate a text box, then sketch 6 characters in it */
$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);

/* Display the CAPTCHA image on the HTML page */
Header (' Content-type:image/jpeg ');
Set the type of picture output
Imagejpeg ($image);
Show pictures
Imagedestroy ($image);
Destroying a picture instance
$_session[' 6_letters_code '] = $code;

function Hexrgb ($HEXSTR) {
$int = Hexdec ($HEXSTR);

Return Array ("Red" = 0xFF & ($int >> 0x10),
"Green" 0xFF & ($int >> 0x8),
"Blue" = 0xFF & $int
);
}
?>

Verification Code

After the build, we want to apply in the actual project, usually we use AJAX can implement click Verification Code refresh generate a new verification code (sometimes generated verification code is difficult to recognize the naked eye), that is, "can not see a change." After completing the verification code, you also need to verify that the verification code is correct, the process of verification is to the background program to complete, but we can also use Ajax to achieve no refresh verification.

Methods to verify that the captcha is correct or incorrect
The text on the captcha image is stored in the session variable, and when validated, we need to compare the values in the session with the values entered by the user.

$_session[6_letters_code]– the text value of the verification code is stored
$_post[6_letters_code]– This is the content of the verification code entered by the user


We set up a front-end page index.html, load jquery, and add a captcha form element to the body:

The code is as follows Copy Code

Verification Code:


In the HTML code,

The code is as follows Copy Code

$ (function () {
Digital verification
$ ("#getcode_num"). Click (function () {
$ (this). attr ("src", ' code_num.php ' + math.random ());
});
...
});

Refresh the verification code, in fact, is to re-request the verification code generator, it is important to note that when calling code_num.php with random parameters to prevent caching. Next fill in the Verification code, click the "Submit" button, through $.post (), the front-end back to the chk_code.php to send AJAX requests.

The code is as follows Copy Code

$ (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 ("The verification code is correct! ");
}else{
Alert ("The verification code is wrong! ");
}
});
});
});


Background chk_code.php Verification:

The code is as follows Copy Code

Session_Start ();

$code = Trim ($_post[' code ');
if ($code ==$_session["Helloweba_num"]) {
echo ' 1 ';
}

The background is verified by the verification code that is submitted and saved in the session.

http://www.bkjia.com/PHPjc/629628.html www.bkjia.com true http://www.bkjia.com/PHPjc/629628.html techarticle in web Development in order to provide user experience most of us use Ajax to do some things, let me introduce an AJAX implementation of the non-refresh page verification code Ajax verification needs of friends ...

  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.