Verification Code making
First, the experiment introduction
This experiment will lead to the use of object-oriented ideas to encapsulate a validation code class. And in the registration and landing interface to display the use. Through the study of this experiment, you will understand the OOP ideas of PHP, as well as the use of GD Library, verification code generation.
1.1 Points of knowledge involved
Php
GD Library
OOP programming
1.2 Development tools
Sublime, a convenient and fast text editor. Click on the bottom left corner of the desktop: Application menu/Development/sublime
1.3 Effect Chart
second, the package Verification code class
2.1 Creating directories and preparing fonts
In the Web directory to create an admin directory as our background directory, store the background code files. Create a fonts directory under Admin to store the fonts needed to make the verification code.
Create a new captcha.php file under Admin, which is the authentication code class file that we need to edit.
Current directory hierarchy:
Edit captcha.php File:
<?php
/**
* Captcha Class
*/
Class Captcha
{
function __construct ()
{
# code ...
}
}
To add a private property and a construction method for the class:
<?php
/**
* Captcha Class
*/
Class Captcha
{
Private $codeNum; Verify code digits
Private $width; Verify Code picture width
Private $height; Verify Code picture Height
Private $img; Image resource Handle
Private $lineFlag; Whether to generate interference lines
Private $piexFlag; Whether to generate interference points
Private $fontSize; Font size
Private $code; Verify Code characters
Private $string; To generate the character set of a CAPTCHA
Private $font; Font
function __construct ($codeNum = 4, $height = $width =, $fontSize =, $lineFlag = True, $piexFlag = True)
{
$this->string = ' qwertyupmkjnhbgvfcdsxa123456789 '; Remove some of the similar characters
$this->codenum = $codeNum;
$this->height = $height;
$this->width = $width;
$this->lineflag = $lineFlag;
$this->piexflag = $piexFlag;
$this->font = dirname (__file__). ' /fonts/consola.ttf ';
$this->fontsize = $fontSize;
}
}
Font files can be downloaded to the fonts directory by the following command:
$ wget Http://labfile.oss.aliyuncs.com/courses/587/consola.ttf
The next step is to start writing specific methods:
Create an image resource handle
Create an image resource
Public Function CreateImage () {
$this->img = imagecreate ($this->width, $this->height); Create an image resource
Imagecolorallocate ($this->img,mt_rand (0,100), Mt_rand (0,100), Mt_rand (0,100)); Fill image background (with light color)
}
Related functions to use
Imagecreate: Create a new palette-based image
Imagecolorallocate: Assigning color to an image
Mt_rand: Generate better random numbers
Creating a CAPTCHA string and outputting it to an image
//Create Authenticode
Public Function Createcode () {
$ strlen = strlen ($this->string)-1;
for ($i =0 $i < $this->codenum; $i + +) {
& nbsp; $this->code. = $this->string[mt_rand (0, $strlen)]; //Randomly remove four characters from character set stitching
}
$_session[' Code ' = $this->code; //Join session
Calculate each character spacing
$diff = $this->width/$this->codenum;
For ($i =0 $i < $this->codenum; $i + +) {
Generate color for each character (using dark)
$txtColor = Imagecolorallocate ($this->img,mt_rand (100,255), Mt_rand (100,255), Mt_rand (100,255));
Write image
Imagettftext ($this->img, $this->fontsize, Mt_rand ( -30,30), $diff * $i +mt_rand (3,8), Mt_rand ($this-> HEIGHT-10), $txtColor, $this->font, $this->code[$i]);
}
}
Related functions to use:
Imagettftext: Writing text to an image with a TrueType font
Create a noise line
Create a noise line (default four)
Public Function Createlines () {
For ($i =0 $i < 4; $i + +) {
$color = Imagecolorallocate ($this->img,mt_rand (0,155), Mt_rand (0,155), Mt_rand (0,155)); Use light-colored
Imageline ($this->img,mt_rand (0, $this->width), Mt_rand (0, $this->height), Mt_rand (0, $this->width), Mt_ Rand (0, $this->height), $color);
}
}
Related functions to use:
Imageline: Draw a line segment
Create a disturbance point
Create a disturbance point (default 100 dots)
Public Function Createpiex () {
for ($i =0; $i < $i + +) {
$color = Imagecolorallocate ($this->img,mt_rand (0,255), Mt_rand (0,255), Mt_rand (0,255));
Imagesetpixel ($this->img,mt_rand (0, $this->width), Mt_rand (0, $this->height), $color);
}
}
Related functions to use:
Imagesetpixel: Draw a single pixel
External output Image:
Public Function Show ()
{
$this->createimage ();
$this->createcode ();
if ($this->lineflag) {//whether to create interference lines
$this->createlines ();
}
if ($this->piexflag) {//whether to create a disturbance point
$this->createpiex ();
}
Header (' content-type:image/png '); The content of the request page is an image in PNG format
Imagepng ($this->img); Output images in PNG format
Imagedestroy ($this->img); Clear image resources, freeing memory
}
Related functions to use:
Imagepng: Output the image to a browser or file in PNG format
Imagedestroy: Destroying an image
External Verification Code:
Public Function GetCode () {
return $this->code;
}
The complete code is as follows:
<?php
/**
* Captcha Class
*/
Class Captcha
{
Private $codeNum;
Private $width;
Private $height;
Private $img;
Private $lineFlag;
Private $piexFlag;
Private $fontSize;
Private $code;
Private $string;
Private $font;
function __construct ($codeNum = 4, $height = $width =, $fontSize =, $lineFlag = True, $piexFlag = True)
{
$this->string = ' qwertyupmkjnhbgvfcdsxa123456789 ';
$this->codenum = $codeNum;
$this->height = $height;
$this->width = $width;
$this->lineflag = $lineFlag;
$this->piexflag = $piexFlag;
$this->font = dirname (__file__). ' /fonts/consola.ttf ';
$this->fontsize = $fontSize;
}
Public Function CreateImage () {
$this->img = imagecreate ($this->width, $this->height);
Imagecolorallocate ($this->img,mt_rand (0,100), Mt_rand (0,100), Mt_rand (0,100));
}
Public Function Createcode () {
$strlen = strlen ($this->string)-1;
For ($i =0 $i < $this->codenum; $i + +) {
$this->code. = $this->string[mt_rand (0, $strlen)];
}
$_session[' Code ' = $this->code;
$diff = $this->width/$this->codenum;
For ($i =0 $i < $this->codenum; $i + +) {
$txtColor = Imagecolorallocate ($this->img,mt_rand (100,255), Mt_rand (100,255), Mt_rand (100,255));
Imagettftext ($this->img, $this->fontsize, Mt_rand ( -30,30), $diff * $i +mt_rand (3,8), Mt_rand ($this-> HEIGHT-10), $txtColor, $this->font, $this->code[$i]);
}
}
Public Function Createlines () {
For ($i =0 $i < 4; $i + +) {
$color = Imagecolorallocate ($this->img,mt_rand (0,155), Mt_rand (0,155), Mt_rand (0,155));
Imageline ($this->img,mt_rand (0, $this->width), Mt_rand (0, $this->height), Mt_rand (0, $this->width), Mt_ Rand (0, $this->height), $color);
}
}
Public Function Createpiexs () {
for ($i =0; $i < 100; $i + +) {
$color = imagecolorallocate ($this- >img,mt_rand (0,255), Mt_rand (0,255), Mt_rand (0,255));
Imagesetpixel ($this->img,mt_rand (0,$ This->width), Mt_rand (0, $this->height), $color);
}
}
public Function Show ()
{
$this->createimage ();
$this->createcode ();
if ($this->lineflag) {
$this->createlines ();
}
if ($this->piexflag) {
$this->createpiexs ();
}
Header (' content-type:image/png ');
imagepng ($this->img);
Imagedestroy ($this->img);
}
Public Function GetCode () {
return $this->code;
}
}
That's all the code for the validation code class. It seems to be quite simple, but with a lot of image processing functions, the related functions I also do the necessary links and use instructions. These functions do not have to memorize, encountered unclear, at any time to check the official PHP documents, the most important is the Chinese document.
2.2 Using the Verification code
Now that the package is finished, you can start using it. Here for convenience, call the class directly below the Captcha class:
Session_Start (); Open session
$captcha = new Captcha (); Instantiating a validation code class (customizable parameters)
$captcha->show (); Call output
Third, front end display
The back end is ready to verify the code, the front-end interface can be shown, modify the registration and login form in the index.php part of the Verification code:
<div class= "Form-group" >
<div class= "col-sm-12" >
<span>click to Switch</span>
</div>
</div>
The IMG tag adds the JS code for the Click event, which enables you to click on the Change verification code!
Effect Chart:
Four, improve