基于PHP实现用户注册登录功能
本文介绍的是基于php实现用户注册登录功能,本项目分为四部分内容:1前端页面制作,2验证码制作,3实现注册登陆,4功能完善。具体情况可以往下看。
验证码制作
一、实验简介
本次实验将会带领大家使用面向对象的思想封装一个验证码类。并在注册和登陆界面展示使用。通过本次实验的学习,你将会领悟到 php 的 oop 思想,以及 gd 库的使用,验证码生成。
1.1 涉及到的知识点
- php
- gd库
- oop编程
1.2 开发工具
sublime,一个方便快速的文本编辑器。点击桌面左下角: 应用程序菜单/开发/sublime
二、封装验证码类
2.1 建立目录以及准备字体
在 web 目录下建立一个 admin 目录作为我们的后台目录,存放后台代码文件。在 admin 下建立一个 fonts 目录,用于存放制作验证码所需字体。
在 admin 下新建一个 captcha.php 文件,这就是我们需要编辑的验证码类文件。
当前目录层次结构:
编辑 captcha.php 文件:
<?php /** * captcha class */ class captcha { function __construct() { # code... } }
添加该类的私有属性和构造方法:
<?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 = 50,$width = 150,$fontsize = 20,$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; } }
字体文件可通过以下命令下载到 fonts 目录:
$ wget
接下来开始编写具体的方法:
创建图像资源句柄
//创建图像资源 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)); //填充图像背景(使用浅色) }
用到的相关函数
- imagecreate:新建一个基于调色板的图像
- imagecolorallocate:为一幅图像分配颜色
- mt_rand:生成更好的随机数
创建验证码字符串并输出到图像
//创建验证码 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; //加入 session 中 //计算每个字符间距 $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]); } }
用到的相关函数
- imagecreate:新建一个基于调色板的图像
- imagecolorallocate:为一幅图像分配颜色
- mt_rand:生成更好的随机数
创建验证码字符串并输出到图像
//创建验证码 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; //加入 session 中 //计算每个字符间距 $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]); } }
用到的相关函数:
- imagettftext:用 truetype 字体向图像写入文本
创建干扰线条
//创建干扰线条(默认四条) 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); } }
用到的相关函数:
- imageline:画一条线段
创建干扰点
//创建干扰点 (默认一百个点) 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); } }
使用的相关函数:
- imagesetpixel:画一个单一像素
对外输出图像:
public function show() { $this->createimage(); $this->createcode(); if ($this->lineflag) { //是否创建干扰线条 $this->createlines(); } if ($this->piexflag) { //是否创建干扰点 $this->createpiex(); } header('content-type:image/png'); //请求页面的内容是png格式的图像 imagepng($this->img); //以png格式输出图像 imagedestroy($this->img); //清除图像资源,释放内存 }
用到的相关函数:
- imagepng:以 png 格式将图像输出到浏览器或文件
- imagedestroy:销毁一图像
对外提供验证码:
public function getcode(){ return $this->code; } 完整代码如下: <?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 = 50,$width = 150,$fontsize = 20,$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(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; } }
以上就是验证码类的全部代码。看起来确实挺简单的,不过用的图像处理函数比较多,上面相关的函数我也做了必要的链接和用途说明。这些函数也不用死记硬背,遇到不清楚的,随时查阅 php 官方文档,最重要的是还有中文文档。
2.2 使用验证码
既然已经封装完毕,那就可以开始使用了。这里为了方便,直接在 captcha 类的下方调用该类:
session_start(); //开启session $captcha = new captcha(); //实例化验证码类(可自定义参数) $captcha->show(); //调用输出
三、前端展示
后端已经准备好了验证码,前端界面就可以展示了,修改 index.php 中的注册与登陆表单的验证码部分:
<div class="form-group"> <div class="col-sm-12"> <img src="admin/captcha.php" alt="" id="codeimg" onclick="javascript:this.src = 'admin/captcha.php?'+math.random();"> <span>click to switch</span> </div> </div>
img 标签添加了点击事件的 js 代码,这样就可以实现点击更换验证码的功能!
效果图:
四、完善
到目前为止,我们的验证码模块基本就完成了。学习到这里,大家应该对面向对象编程有了进一步的理解。也领悟到了一丝 oop 思想。oop 的三大特征:封装,继承,多态。我们这里只用到了一点封装的思想。大家可以继续完善和改进这个验证码类,设计出更加完美的类。这个实验也告诉我们,php 的函数很多,不要死记硬背,多看官方文档。