您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關(guān)Laravel8如何使用圖形驗(yàn)證碼做登錄功能的內(nèi)容。小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧。
composer require gregwar/captcha
//路由分組 Route::group(['prefix'=>'admin','namespace'=>'Admin'],function (){ //登錄顯示 name給路由起一個(gè)別名 Route::get('login','LoginController@index')->name('admin.login'); //登錄方法 name給路由起一個(gè)別名 Route::post('login','LoginController@login')->name('admin.login'); //定義圖形驗(yàn)證碼路由 Route::get('img_code','CommonController@imgCode')->name('admin.img_code'); });
<?php namespace App\Http\Controllers\Admin; use App\Http\Controllers\Controller; use Carbon\Carbon; use Gregwar\Captcha\CaptchaBuilder; use Gregwar\Captcha\PhraseBuilder; class CommonController extends Controller { //驗(yàn)證碼 public function imgCode() { $phrase = new PhraseBuilder; // 設(shè)置驗(yàn)證碼位數(shù) $code = $phrase->build(4); // 生成驗(yàn)證碼圖片的Builder對(duì)象,配置相應(yīng)屬性 $builder = new CaptchaBuilder($code, $phrase); // 設(shè)置背景顏色25,25,112 $builder->setBackgroundColor(34, 0, 45); // 設(shè)置傾斜角度 $builder->setMaxAngle(25); // 設(shè)置驗(yàn)證碼后面最大行數(shù) $builder->setMaxBehindLines(10); // 設(shè)置驗(yàn)證碼前面最大行數(shù) $builder->setMaxFrontLines(10); // 設(shè)置驗(yàn)證碼顏色 $builder->setTextColor(230, 81, 175); // 可以設(shè)置圖片寬高及字體 $builder->build($width = 150, $height = 40, $font = null); // 獲取驗(yàn)證碼的內(nèi)容 $phrase = $builder->getPhrase(); // 把內(nèi)容存入 cache,10分鐘后過(guò)期 $client_id = md5( rand(1,1000).time()); \Cache::put($client_id, $phrase, Carbon::now()->addMinutes(10)); // 組裝接口數(shù)據(jù) $data = [ 'client' => $client_id, 'captcha' => $builder->inline(), ]; return $data; } } ![image.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/8034e8b8f6ac4f0abe121f296591e3bd~tplv-k3u1fbpfcp-watermark.image)
<script> //頁(yè)面加載完畢事件 $(function(){ getCaptCha(); }); //獲取圖形驗(yàn)證碼的方法 var getCaptCha = function (){ $.ajax({ url:"{{route('admin.img_code')}}", success(res){ $("#client").val(res.client); $("#img_code").attr('src',res.captcha); } }) } </script>
<input type="hidden" id="client" name="client" >
<div class="row cl"> <div class="formControls col-xs-8 col-xs-offset-3"> <input name="captcha" class="input-text size-L" type="text" placeholder="驗(yàn)證碼" onblur="if(this.value==''){this.value='驗(yàn)證碼:'}" onclick="if(this.value=='驗(yàn)證碼:'){this.value='';}" value="" > <img id="img_code" src="" onclick="getCaptCha()"> <a id="kanbuq" onclick="getCaptCha()" href="javascript:;" rel="external nofollow" >看不清,換一張</a> </div> </div>
前臺(tái)頁(yè)面實(shí)現(xiàn)效果:
//登錄方法 public function login(Request $request) { //接收所有參數(shù) $params = $request->all(); //取出驗(yàn)證碼是否一致 $captcha = \Cache::get($params['client']); if ($params['captcha'] != $captcha){ return redirect(route('admin.login'))->withErrors(['error' => '驗(yàn)證碼錯(cuò)誤']); } }
感謝各位的閱讀!關(guān)于“Laravel8如何使用圖形驗(yàn)證碼做登錄功能”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。