User registration and logon based on PHP

Source: Internet
Author: User
This course uses PHP and Web front-end technology to implement a website registration logon portal page, learn and practice PHP programming, etc. if you are interested, refer to it. This article describes how to implement the user registration and login function based on PHP. this project is divided into four parts: 1 front-end page creation, 2 verification code creation, 3 registration and login, and 4 complete functions. For more information, see.

Verification code creation

1. Experiment introduction

This experiment will show you how to encapsulate a verification code class using the object-oriented idea. It is displayed and used on the registration and login interfaces. Through this experiment, you will understand the OOP idea of PHP, the usage of the GD library, and the generation of verification codes.

1.1 knowledge points involved

PHP

GD Library

OOP programming

1.2 Development tools

Sublime, a convenient and quick text editor. Click application menu/development/sublime in the lower left corner of the desktop

II. encapsulation of verification codes

2.1 create a directory and prepare a font

Create an admin directory under the web Directory as our background directory to store background code files. Create a fonts directory under admin to store the fonts required for the verification code.

Create a new Captcha. php file under admin, which is the verification code file to be edited.

Current directory hierarchy:

Edit the Captcha. php file:

 

Add the private attributes and constructor of the class:

  String = 'qwertyupmkjnhbgvfcdsxa123456789 '; // remove some 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 ;}}

To download a fonts file, run the following command:

$ Wget http://labfile.oss.aliyuncs.com/courses/587/consola.ttf

Next, write the specific method:

Create 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 the image background (use light color )}

Related functions used

Imagecreate: Creates a palette-based image.

Imagecolorallocate: assign color to an image

Mt_rand: generate better random numbers

Create a verification code string and output it to the image

// Create the verification code public function createCode () {$ strlen = strlen ($ this-> string)-1; for ($ I = 0; $ I <$ this-> codeNum; $ I ++) {$ this-> code. = $ this-> string [mt_rand (0, $ strlen)]; // randomly retrieve four character concatenation from the character set} $ _ SESSION ['code'] = $ this-> code; // join the session // calculate the spacing of each character $ diff = $ this-> width/$ this-> codeNum; for ($ I = 0; $ I <$ this-> codeNum; $ I ++) {// Generate a color for each character (dark) $ txtColor = imagecolorallocate ($ this-> img, mt_rand (100,255), mt_rand (100,255), mt_rand (100,255); // write the image imagettftext ($ this-> img, $ this-> fontSize, mt_rand ), $ diff * $ I + mt_rand (3, 8), mt_rand (20, $ this-> height-10), $ txtColor, $ this-> font, $ this-> code [$ I]);}

Related functions used

Imagecreate: Creates a palette-based image.

Imagecolorallocate: assign color to an image

Mt_rand: generate better random numbers

Create a verification code string and output it to the image

// Create the verification code public function createCode () {$ strlen = strlen ($ this-> string)-1; for ($ I = 0; $ I <$ this-> codeNum; $ I ++) {$ this-> code. = $ this-> string [mt_rand (0, $ strlen)]; // randomly retrieve four character concatenation from the character set} $ _ SESSION ['code'] = $ this-> code; // join the session // calculate the spacing of each character $ diff = $ this-> width/$ this-> codeNum; for ($ I = 0; $ I <$ this-> codeNum; $ I ++) {// Generate a color for each character (dark) $ txtColor = imagecolorallocate ($ this-> img, mt_rand (100,255), mt_rand (100,255), mt_rand (100,255); // write the image imagettftext ($ this-> img, $ this-> fontSize, mt_rand ), $ diff * $ I + mt_rand (3, 8), mt_rand (20, $ this-> height-10), $ txtColor, $ this-> font, $ this-> code [$ I]);}

Related functions used:

Imagettftext: Use the TrueType font to write text to the image

Create interference line

// Create interference lines (four by default) 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 used:

Imageline: draw a line segment

Create interference points

// Create interference points (one hundred by default) public function createPiex () {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 );}}

Related functions used:

Imagesetpixel: draw a single pixel

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 interference points $ this-> createPiex ();} header ('content-type: image/png '); // The Content of the request page is a png image imagepng ($ this-> img ); // output image imagedestroy ($ this-> img) in png format; // clear Image resources and release memory}

Related functions used:

Imagepng: outputs an image to a browser or file in PNG format.

Imagedestroy: destroy an image

Verification code provided externally:

public function getCode(){    return $this->code;  }

The complete code is as follows:

  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(20,$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;  }}

The above is all the code of the verification code class. It seems quite simple, but there are many image processing functions. I have also made necessary links and usage descriptions for the above functions. These functions do not have to be memorized. if you are not clear about them, you can check the official PHP documentation at any time. the most important thing is the Chinese documentation.

2.2 use verification code

Now that the package has been completed, you can start to use it. For convenience, the class is called directly below the Captcha class:

Session_start (); // enable session $ captcha = new Captcha (); // instantiate the verification code class (customizable parameters) $ captcha-> show (); // call the output

3. front-end display

The verification code has been prepared at the backend, and can be displayed on the front-end interface. modify the verification code section of the registration and login form in index. php:

Click to Switch

The img tag adds the js code of the click event, so that you can click to change the verification code!

:

So far, our verification code module has basically been completed. After learning this, you should have a better understanding of object-oriented programming. I also learned a bit about OOP. Three features of OOP: encapsulation, inheritance, and polymorphism. Here we only use the idea of encapsulation. You can continue to improve the verification code class and design a more perfect class. This experiment also tells us that there are a lot of PHP functions, so don't memorize them. read more official documents.

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.