Laravelで投稿アプリの機能を作成 ~ログインカスタマイズ編Ⅱ~


はじめに

以前最短でログインフォームをカスタマイズ(login.blade.phpを利用する)を紹介しましたが、
今回はログイン画面そのものもオリジナルの記事を紹介いたします。

前提

・前回のデータを元に修正していくので、一緒にデータを作りたい方は
下記から見ることをお勧めします
https://qiita.com/ProgramingDai/items/cf6944f9cd0ac08f4e3e
https://qiita.com/ProgramingDai/items/249acc8894079ee58268
https://qiita.com/ProgramingDai/items/fee669e5a8cf67f0e38e

実装イメージ

postフォルダ内に「auth.blade.php」を作成

ここをログイン認証のページにする

「PostController.php」にログイン処理を書く

ルーティング設定

手順レシピ

1.ビューを作成/ビューテンプレートの修正

/resources/views/post/auth.blade.php
@extends('layouts.postapp')

@section('content')
@section('maincopy', $message)

<form method="POST" action="{{ route('post.auth') }}">
    {{ csrf_field() }}
    <input type="text" class="form" name="email" placeholder="メールアドレス">
    <div><input type="password" class="form" name="password" placeholder="パスワード"></div>
    <input type="submit" class="create" value="ログイン">
</form>
@endsection
/resources/views/layouts/postapp.blade.php
<!--中略-->

@if(Auth::check())
        <!--認証中なら-->
        <!--ルートの変更: {{ route('user.logout') }} => {{ route('post.logout') }}-->
        <a href="{{ route('post.logout') }}"><img src="{{ asset('img/logout.svg') }}" class="add" alt="ログアウト"></a>

<!--中略-->

2.コントローラーにログイン周りの処理を追加

/app/Http/Controllers/PostController
// 中略

    // ログイン画面
    public function getAuth(Request $request) {
        $param = ['message' => 'ログインしてください'];
        return view('post.auth', $param);
    }

    // ログイン処理
    public function postAuth(Request $request) {
        $email = $request->email;
        $password =  $request->password;

        // Authファサードのattemptで整合
        if(Auth::attempt(['email' => $email, 'password' => $password])){
            return redirect('/post');
        } else {
            $msg = 'メールアドレスかパズワードが違います';
            return view('post.auth',['message'=>$msg]);
        }
    }

    // ログアウト遷移先変更
    public function getLogout(Request $request){
        Auth::logout();
        return redirect()->route('post.auth');
    }

3.ルーティング設定

/routes/web.php
// 中略

// Auth周りのルーティング
Route::get('auth', 'PostController@getAuth')->name('login');
Route::post('auth', 'PostController@postAuth')->name('post.auth');
Route::get('logout', 'PostController@getLogout')->name('post.logout');

これで完全オリジナルのログイン画面の完成です。
試しに
192.168.10.10/authにアクセスし、ログインとログアウトを試してみてください。

あとがき

これでCRUD編、リレーション編、ログインカスタマイズ編(2種の方法)を紹介いたしました。最後は、新規登録画面のカスタマイズになります。そちらも実装次第、アップさせていただきます。

Laravelで投稿アプリの機能を作成
~CRUD編~
https://qiita.com/ProgramingDai/items/cf6944f9cd0ac08f4e3e
~リレーション編~
https://qiita.com/ProgramingDai/items/249acc8894079ee58268
~ログインカスタマイズ編Ⅰ~
https://qiita.com/ProgramingDai/items/fee669e5a8cf67f0e38e
~ログインカスタマイズ編Ⅱ~
https://qiita.com/drafts/4fe2e3cc90987356c9c4