Laravel ログイン画面作成

ここではLaravelでログイン画面を作成してログイン成功画面へのリダイレクトまでを行いたいと思います。

環境
Laravel:5.8
PHP:7.1.3
OS:Win10 XAMPP
ツール:Composer
DB:MySQL

やる事の順番
1.DBにログインする情報を設定
2.URLのルーティング
3.コントローラー作成
4.View作成
5.モデル作成

1.DB設定ファイル

config\database.php

'default' => env('DB_CONNECTION', 'mysql'),

'mysql' => [
    'driver' => 'mysql',
    'url' => env('DATABASE_URL'),
    'host' => env('DB_HOST', '127.0.0.1'),
    'port' => env('DB_PORT', '3306'),
    'database' => env('DB_DATABASE', 'laravel_test'),
    'username' => env('DB_USERNAME', 'root'),
    'password' => env('DB_PASSWORD', ''),
    'unix_socket' => env('DB_SOCKET', ''),
    'charset' => 'utf8mb4',
    'collation' => 'utf8mb4_unicode_ci',
    'prefix' => '',
    'prefix_indexes' => true,
    'strict' => true,
    'engine' => null,
    'options' => extension_loaded('pdo_mysql') ? array_filter([
        PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
    ]) : [],
],

\.env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel_test
DB_USERNAME=root
DB_PASSWORD=

2.URLのルーティング

routes/web.php

//Route::get('/', function () {
//    return view('welcome');
//});

Route::get('/login', 'LoginController@index');
Route::post('/login/post', 'LoginController@post');
Route::get('/admin', 'AdminController@index');

http://localhost/laravel/loginにGETでアクセスするとLoginControllerのindexメソッドが呼ばれる。
http://localhost/laravel/login/postにPOSTでアクセスするとLoginControllerのPOSTメソッドが呼ばれる。
以下略

3.コントローラー作成

app/Http/Controllers\LoginController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Model\MstUser;

class LoginController extends Controller
{
    public function index()
    {
        $arrCSS = $this->setCSS();
        $arrJS = $this->setJS();
        return view('login', ['arrCSS' => $arrCSS, 'arrJS' => $arrJS]);
    }

    public function post(Request $req)
    {
        $table = new MstUser;
        $login = $table->isLogin($req->user_id, $req->pass);
        if (empty($login)) {
            return view('login', ['errorMsg' => 'ログインできませんでした']);
        } else {
            return redirect()->action('AdminController@index');
        }
    }

    public function setCSS() {
        $arrCSS = array();
        array_push($arrCSS, '/css/app.css');
        return $arrCSS;
    }

    public function setJS() {
        $arrJS = array();
        array_push($arrJS, '/js/app.js');
        return $arrJS;
    }
}

app/Http/Controllers\AdminController.php

<?php

namespace App\Http\Controllers;

class AdminController extends Controller
{
    public function index()
    {
        return view('admin');
    }
}

return viewの第二引数でviewに変数を渡しています。
筆者はページ固有の情報があればコントローラーで設定していく感じにしてます。

4.View作成

resources\views以下に作成
今回はヘッダーやフッターファイルを使いまわせるようにlayoutsフォルダを作成しサイトの雛形を作成します。
resources\views\layouts\app.blade.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>@yield('title')</title>
@isset($arrCSS)
    @foreach ($arrCSS as $val)
        <link rel="stylesheet" href="{{ asset($val) }}">
    @endforeach
@endisset
@isset($arrJS)
    @foreach ($arrJS as $val)
    <script type="text/javascript" src="{{ asset($val) }}"></script>
    @endforeach
@endisset
</head>
<body>
    <div class="container">
    @include('layouts.header')
    @yield('content')
    @include('layouts.footer')
    </div>
</body>
</html>

ページ毎に切り替えて使いまわす部分
タイトル、CSS、Js、コンテンツ部
resources\views\layouts\以下にheader.blade.php、footer.blade.phpファイルを作成します。
ヘッダー、フッターの確認ができればいいので中身は何でもいいです。

次にログイン画面@yield(‘content’)の部分を作成していきます。
resources\views\login.balade.php

@extends('layouts.app')

@section('title', 'ログイン画面')

@section('content')
<form action="{{ url('login/post')}}" method="POST">
@csrf
ID:<input type="text" name="user_id">
Pass:<input type="text" name="pass">
<input type="submit" value="送信">
</form>
@isset($errorMsg)
{{ $errorMsg }}
@endisset
@endsection

resources\views\admin.balade.php

@extends('layouts.app')

@section('title', 'ログイン成功')

@section('content')
ログインできました。
@endsection

5.モデル作成

app/Model\MstUser.php

<?php

namespace App\Model;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Support\Facades\DB;

class MstUser extends Model
{
    protected $table = 'mst_user';
    protected $guarded = ['id'];

    public function isLogin($userId, $pass)
    {
        $sql = "SELECT id "
             . "  FROM mst_user "
             . " WHERE user_id = '{$userId}' "
             . "   AND pass = '{$pass}' ";
        return DB::select($sql);
    }

}

モデルは好きな場所に作成できます。
モデルを作成した場所をnamespaceに記述してください。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください