Happy Coding
本文目標(biāo)
完成登錄管理頁面與登錄驗證功能
管理用戶模型
在文件夾app下新建文件夾Models洁墙，將文件夾app下的User.php移動到文件夾app/Models下
修改文件User.php的命名空間
namespace App\Models;
打開文件config/auth.php御吞，修改代碼如下
'model' => App\Models\User::class,
新增路由
打開文件app/Http/routes.php诡壁，文件代碼如下：
<?php
Route::group(['namespace' => 'Backend', 'middleware' => ['auth']], function () {
Route::get('/', 'IndexController@index');
});
Route::group(['namespace' => 'Auth'], function () {
Route::get('auth/login', 'AuthController@getLogin');
Route::post('auth/login', 'AuthController@postLogin');
Route::get('auth/logout', 'AuthController@getLogout');
});
新增登錄視圖
在文件夾resources/views/新建文件夾auth，然后新建視圖文件login.blade.php
在文件夾resources/views/backend/layout新建文件夾message崎淳，然后新建視圖文件如下：
- tips.blade.php
- error.blade.php
- success.blade.php
login.blade.php
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>AdminLTE 2 | Log in</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link href="{{ asset("/assets/css/app.css") }}" rel="stylesheet" type="text/css"/>
</head>
<body class="hold-transition login-page">
<div class="login-box">
<div class="login-logo">
<b>TianMao</b>CMF
</div>
<div class="login-box-body">
<p class="login-box-msg">Happy Coding</p>
<form action="{{URL::to('/auth/login')}}" method="post" enctype="multipart/form-data">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<div class="row form-group has-feedback">
<input type="text" class="form-control" placeholder="賬號" name="email">
<span class="fa fa-user form-control-feedback"></span>
@include('backend.layout.message.tips',['field'=>'email'])
</div>
<div class="row form-group has-feedback">
<input type="password" class="form-control" placeholder="密碼" name="password">
<span class="fa fa-lock form-control-feedback"></span>
@include('backend.layout.message.tips',['field'=>'password'])
</div>
<div class="row form-group has-feedback">
<input type="text" class="form-control" placeholder="驗證碼" name="captcha">
<span class="fa fa-image form-control-feedback"></span>
@include('backend.layout.message.tips',['field'=>'captcha'])
</div>
<div class="row form-group has-feedback">
<img src="{{$captcha}}" alt="圖片驗證碼" style="width: 100%;">
</div>
<div class="row">
<div class="col-xs-8">
<div class="checkbox icheck">
<label>
<input type="checkbox" name="remember" value="1"> 保持登錄
</label>
</div>
</div>
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-block btn-flat">登 錄</button>
</div>
</div>
</form>
</div>
</div>
<script src="{{ asset ("/assets/js/app.js") }}"></script>
<script>
$(function () {
$('input').iCheck({
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%'
});
});
</script>
</body>
</html>
tips.blade.php
@if($errors->has($field))
@foreach ($errors->get($field) as $error)
<button class="btn btn-danger col-sm-12 btn-flat" style="width: 100%;">
<i class="fa fa-times-circle-o"></i> {{$error}}
</button>
@endforeach
@endif
error.blade.php
@if(Session::has('errors'))
<div id="errors-message" class="alert alert-danger alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa fa-ban"></i> 錯誤提示!</h4>
@foreach($errors->all() as $error)
{{$error}}
@endforeach
</div>
@endif
success.blade.php
@if(Session::has('success'))
<div id="success-message" class="alert alert-success alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa fa-check"></i> 成功提示!</h4>
{{Session::get('success')}}
</div>
@endif
新增驗證碼Package
打開composer.json文件,修改代碼如下:
"require": {
"php": ">=5.5.9",
"laravel/framework": "5.1.*",
"gregwar/captcha": "1.*"
},
gregwar/captcha是驗證碼Package，用來生成驗證碼巧勤，在終端執(zhí)行以下命令進行安裝。
sudo composer install
管理登錄認(rèn)證控制器
打開文件app/Http/Auth/AuthController.php弄匕，新增代碼如下:
use Illuminate\Support\Facades\Session;
public function getLogin()
{
if (view()->exists('auth.authenticate')) {
return view('auth.authenticate');
}
$builder = new CaptchaBuilder();
$builder->build();
Session::put('phrase', $builder->getPhrase());
return view('auth.login')->with('captcha', $builder->inline());
}
public function postLogin(Request $request)
{
$this->validate($request, [
$this->loginUsername() => 'required',
'password' => 'required',
'captcha' => 'required'
], [
$this->loginUsername() . '.required' => '請輸入郵箱或用戶名稱',
'password.required' => '請輸入用戶密碼',
'captcha.required' => '請輸入驗證碼'
]);
if (Session::get('phrase') !== $request->get('captcha')) {
return redirect()->back()->withErrors(array('captcha' => '驗證碼不正確'))->withInput();
}
}
使用遷移文件生成數(shù)據(jù)表
接下來打開終端颅悉，在項目下運行以下命令，生成用戶表并創(chuàng)建用戶
// 生成數(shù)據(jù)表
php artisan migrate
// 生成用戶數(shù)據(jù)
php artisan tinker
$user = new App\Models\User;
$user->name = "admin";
$user->email = "admin@qq.com";
$user->password = bcrypt(123456);
$user->save();
exit
管理登錄認(rèn)證操作跳轉(zhuǎn)頁面
打開文件app\Http\Controller\Auth\AuthController迁匠，新增以下成員屬性:
// 設(shè)置成功登錄后轉(zhuǎn)向的頁面：
protected $redirectPath = '/';
// 設(shè)置登錄失敗后轉(zhuǎn)向的頁面：
protected $loginPath = '/auth/login';
// 設(shè)置退出登錄后轉(zhuǎn)向的頁面：
protected $redirectAfterLogout = '/';
打開中間件app\Http\Middleware\RedirectIfAuthenticated.php剩瓶，找到相應(yīng)的地方，修改代碼如下：
public function handle($request, Closure $next)
{
// 設(shè)置登錄之后城丧，輸入/auth/login的跳轉(zhuǎn)地址
if ($this->auth->check()) {
return redirect('/');
}
return $next($request);
}
效果預(yù)覽
完成上述步驟后延曙，在瀏覽器輸入項目域名/auth/login，可以看到效果如下：
屏幕快照 2016-02-18 11.38.16.png
