登录验证码实现

验证码是比较常见的一个功能,当用户输入用户名密码后,必须也输入验证码才能提交。

实现原理:

1.随机生成验证码图片,并且把验证码储存在session中;

2.提交登录是验证

前端代码:

<form class="form-signin" method="post" action="">
        <h2 class="form-signin-heading">登录系统</h2>
        <span id="err_box"></span>

        <input type="text" name="username" class="input-block-level" placeholder="账号">
        <input type="password" name="password" class="input-block-level" placeholder="密码">
        <input type="text" name="verify" id='verification' class="input-medium" placeholder="验证码">
<img src="/Home/Api/validatecode.html" onclick="this.src='/Home/Api/validatecode.html?'+Math.random();" alt="">
        <br>
        <input type="text" name="pcode" class="input-block-level" placeholder="手机验证码" style="display: none;">
        <p><button class="btn btn-large btn-primary" type="submit">登录</button></p>
    </form>

img的src属性直接放生成图片的接口路径;

后端代码

1.生成二维码图片接口:/Home/Api/validatecode.html,返回的数据必须是图片格式的文件;设置header('Content-type:image/png');

public function validatecode(){
        ob_clean();
        header('Content-type:image/png');
        import('Common.Com.ValidateCode');
        $_vc = new \ValidateCode();      //实例化一个对象
        $_vc->doimg();
        $code = $_vc->getCode();
        $_SESSION['authnum_session'] = $code;//验证码保存到cookie中
    }

2.附上封装好的生成二维码的类ValidateCode,  

输出图片:$_vc->doimg();

获取验证码:¥_vc->getCode();

//验证码类
class ValidateCode {
 // private $charset = 'abcdefghkmnprstuvwxyzABCDEFGHKMNPRSTUVWXYZ23456789';//随机因子
 private $charset = '0123456789';//随机因子
 private $code;//验证码
 private $codelen = 4;//验证码长度
 private $width = 130;//宽度
 private $height = 50;//高度
 private $img;//图形资源句柄
 private $font;//指定的字体
 private $fontsize = 20;//指定字体大小
 private $fontcolor;//指定字体颜色
 //构造方法初始化
 public function __construct() {
  $this->font = dirname(__FILE__).'/font/simkai.ttf';//注意字体路径要写对,否则显示不了图片
 }
 //生成随机码
 private function createCode() {
  $_len = strlen($this->charset)-1;
  for ($i=0;$i<$this->codelen;$i++) {
   $this->code .= $this->charset[mt_rand(0,$_len)];
  }
 }
 //生成背景
 private function createBg() {
  $this->img = imagecreatetruecolor($this->width, $this->height);
  $color = imagecolorallocate($this->img, mt_rand(157,255), mt_rand(157,255), mt_rand(157,255));
  imagefilledrectangle($this->img,0,$this->height,$this->width,0,$color);
 }
 //生成文字
 private function createFont() {
  $_x = $this->width / $this->codelen;
  for ($i=0;$i<$this->codelen;$i++) {
   $this->fontcolor = imagecolorallocate($this->img,mt_rand(0,156),mt_rand(0,156),mt_rand(0,156));
   imagettftext($this->img,$this->fontsize,mt_rand(-30,30),$_x*$i+mt_rand(1,5),$this->height / 1.4,$this->fontcolor,$this->font,$this->code[$i]);
  }
 }
 //生成线条、雪花
 private function createLine() {
  //线条
  for ($i=0;$i<6;$i++) {
   $color = imagecolorallocate($this->img,mt_rand(0,156),mt_rand(0,156),mt_rand(0,156));
   imageline($this->img,mt_rand(0,$this->width),mt_rand(0,$this->height),mt_rand(0,$this->width),mt_rand(0,$this->height),$color);
  }
  //雪花
  for ($i=0;$i<100;$i++) {
   $color = imagecolorallocate($this->img,mt_rand(200,255),mt_rand(200,255),mt_rand(200,255));
   imagestring($this->img,mt_rand(1,5),mt_rand(0,$this->width),mt_rand(0,$this->height),'*',$color);
  }
 }
 //输出
 private function outPut() {
  // header('Content-type:image/png');
  // $this->img = mb_convert_encoding($this->img, 'utf-8','gbk');
  imagepng($this->img);
  imagedestroy($this->img);
 }
 //对外生成
 public function doimg() {
  $this->createBg();
  $this->createCode();
  $this->createLine();
  $this->createFont();
  $this->outPut();
 }
 //获取验证码
 public function getCode() {
  return strtolower($this->code);
 }
}

猜你喜欢

转载自blog.csdn.net/littlexiaoshuishui/article/details/83376046