Debug客栈
做一个爱分享的程序猿
Debug客栈
Laravel使用gregwar/captcha生成验证码

laravel框架自身并不携带验证码类,我这里采用开源的gregwar/captcha,来做验证码,并判断是否可以登录。

安装扩展库

1、在 laravel 项目根目录下找到 composer.json 这个文件,添加 "gregwar/captcha": "1.*"  到composer.json这个文件中,如下面代码所示。

"require": {
        "php": "^7.1.3",
        "fideloper/proxy": "^4.0",
        "laravel/framework": "5.8.*",
        "laravel/tinker": "^1.0",
        "gregwar/captcha": "1.*"
    },

2、然后打开命令行,找到项目的根目录,运行composer update可以看到这个扩展库已经下载好了,PS:我安装了一遍,现在它提示没有可以更新的。

# composer update
Loading composer repositories with package information
Updating dependencies (including require-dev)
Nothing to install or update
Generating optimized autoload files

好了,安装成功就可以进行项目中运用了。

定义路由

//登录验证码
Route::get('admin/captcha', "Admin\LoginController@captcha");

定义后台引用库方法

/**
 * 验证码
 * @return Response
 */
public function captcha(Request $request){
    $builder = new CaptchaBuilder;
    $builder->build(150,47);
    //获取验证码内容
    $phrase = $builder->getPhrase();
    //把内容存入session 存储验证码
    $request->session()->flash('captchaSession', $phrase);
    //清除缓存
    ob_clean();
    //把验证码数据以jpeg图片的格式输出
    return response($builder->output())->header('Content-type','image/jpeg');
}

定义后台登录方法

/**
 * 后台登录控制方法
 * @param Request $request
 * @return \Illuminate\Http\RedirectResponse|\Illuminate\Routing\Redirector
 */
public function check(Request $request){
    //接收数值
    $name = $request->input("name");
    $pass = $request->input("pass");
    $code = $request->input("code");
    //获取验证码的数值
    $yzm = $request->session()->get('captchaSession');
    //判断用户是否输入
    if($name == ''){
        return back()->with("error", "用户名不存在");
    }
    if($pass == ''){
        return back()->with("error", "密码不存在");
    }
    if($code == ''){
        return back()->with("error", "验证码不存在");
    }
    //加密获取的数据
    $md5Pass = md5($pass);
    //验证数据库中是否有数据
    $result = DB::table('user')->where([
        ['name','=',$name],
        ['pass','=',$md5Pass]
    ])->first();
    //获取用户id
    $id = $result->id;
    // 验证验证码是否与存在session值一样
    if($code == $yzm){
        // 验证是否有该用户并且有效
        if($result){
            //向网站中存储数据
            $request->session()->put('adminUserInfo', ['name'=>$name, 'id'=>$id]);
            return redirect('/admin');
        }else{
            return back()->with("error", "好像登录失败了,重新登陆一下吧");
        }
    }else{
        return back()->with("error", "验证码输入不正确");
    }
}

前台验证码HTML代码

<div class="form-group">
    <div class="input-group">
        <input type="text" class="form-control" name="code" placeholder="验证码">
        <div class="input-group-append">
            <img src="/admin/captcha" alt="验证码" id="codeimg" onclick="captcha(this);return false;">
        </div>
    </div>
</div>

前台验证码刷新JS代码

/**
 * 点击验证码刷新验证码功能
 * @param obj
 */
function captcha(obj){
    //更换地址
    obj.src='/admin/captcha?code='+Math.random();
}
https://www.debuginn.cn/wp-content/uploads/2019/06/image-1.png
验证码获取界面

相关问题

乱码问题

这里有两个问题需要注意,照着下面的方法去直接输出验证码,你会发现验证码显示不出来,反而是一堆乱码。

public function captcha(Request $request){
    $builder = new CaptchaBuilder;
    $builder->build(150,47);
    header('Content-type','image/jpeg');
    $builder->output();
}
https://www.debuginn.cn/wp-content/uploads/2019/06/image-6.png
出现乱码错误

验证码信息有误

输出一下$phrase,发现验证码内容已经获取到了,是图片生成部分出的问题,header("Cache-Control: no-cache, must-revalidate");
这行代码的作用是清除缓存,防止出现验证码不能刷新或显示不出来的情况,但是并没有起作用,改用 ob_clean(); 去清除浏览器缓存。然后是
header('Content-Type: image/jpeg');
$builder->output();

这两句话的问题,
$builder->output();
返回的只是验证码图片的一些信息,并不是一张图片,所以当把它直接输出时,出来的并不是一张图片,只有这样写
return response($builder->output())->header('Content-type','image/jpeg');
直接输出的时候,才会以图片的形式直接输出验证码。
当把它放到的src属性中,标签会自动以图片的格式输出它,也就是说header('Content-type','image/jpeg')
这时候这句话是没必要的,所以不管是
response($builder->output())->header('Content-type','image/jpeg');
这样写,还是
header('Content-Type: image/jpeg');
$builder->output();

这样写,结果都会显示验证码图片。
return response($builder->output())->header('Content-type','image/jpeg');
直接输出的时候,才会以图片的形式直接输出验证码。
当把它放到的src属性中,标签会自动以图片的格式输出它,也就是说header('Content-type','image/jpeg')
这时候这句话是没必要的,所以不管是
response($builder->output())->header('Content-type','image/jpeg');
这样写,还是
header('Content-Type: image/jpeg');
$builder->output();

这样写,结果都会显示验证码图片。

https://www.debuginn.cn/wp-content/uploads/2019/06/image-7.png
好了,大功告成

到这里就可以了,正常显示,嘿嘿嘿.

感谢文章

止喜 《laravel5.4生成验证码》

最后感谢止喜的文章,让我解决了这个问题,同时,为了自己以后不进这个坑,写一篇这样的技术文章,其中借鉴了一点经验,谢谢。

感谢开源组件

最后感谢开源组件Gregwar/Captcha,谢谢。

赞赏
本文链接:https://www.debuginn.cn/3124.html
本文采用 CC BY-NC-SA 3.0 Unported 协议进行许可,转载请保留文章链接
Debug客栈  |  Debug客栈引导页  |  Debug客栈交流群  |  赞助本站  |  博主微博  |  音乐下载器

发表评论

textsms
account_circle
email

Debug客栈

Laravel使用gregwar/captcha生成验证码
laravel框架自身并不携带验证码类,我这里采用开源的gregwar/captcha,来做验证码,并判断是否可以登录。 安装扩展库 1、在 laravel 项目根目录下找到 composer.json 这个文件,添…
扫描二维码继续阅读
2019-06-24
文章日历
2019年七月
« 6月    
1234567
891011121314
15161718192021
22232425262728
293031  
近期评论
统计数据
  • 1
  • 24
  • 9,659
  • 4,932
  • 49
  • 305
  • 191
  • 2019年7月18日
本站存活