Fippiyのプログラム学習内容アウトプットBlog

日々の学習内容をアウトプットして振り返りを実施する。

Laravel開発、ログイン機能実装

Laravelで今回はユーザログイン機能を実装しました。

 

ユーザ毎に情報管理を実施する想定をしていたので、ログインしないと内部の画面には移動できない使用で今回は実装します。

やりたいこと

  1. Authクラス利用による認証システムをつける
  2. トップページを作成して、新規登録とログインのリンクを設定する
  3. ログイン・ログアウトができるようにする

 やったこと

ログイン認証システムの実装

コマンド一つで簡単作成

Authクラス利用による認証システムはコマンドひとつで実装ができます。

$ php artisan make:auth

このコマンドひとつでログイン周りの設定はあっというまにできます、簡単ですね…。

ルーティング・コントローラ、アクションからビューまで全部自動生成。

f:id:Fippiy:20190323113542p:plain

生成ファイル
ユーザ管理データベース

ログインユーザの管理にはUserテーブルが必要ですが、こちらも実は一番初めにプロジェクトを作成した段階でマイグレーションファイルができており、すでにマイグレーションファイルも利用しているのでデータベースもそろっている状態。

ということはもうログインできる状態に…。

ログイン画面

早速作成したログイン画面にアクセス。

http://localhost:3000/ 

f:id:Fippiy:20190323113317p:plain

ログイン画面

カスタマイズは一切していませんが、ログインはとりあえずできます。

 

作成コード確認時のGit確認

余談ですが、GitのCLIコマンドで作成されたファイルの差分データ確認には

$ git diff

コマンドがあるのですが、これだと変更がかかったファイルの内容しか確認できず、大量に新規作成したファイルの内容が確認できませんでした。

そこで調べてみました、こちらを参考にさせて頂きました。ありがとうございます。

 

reasonable-code.com

こちらで新規作成ファイルの中身を確認。

このままファイルを編集すればカスタマイズも容易そうなんですが、まずは最低限実装が第一段階なので、とりあえずこのままでいきます。

トップページ作成

最低限といっても、入り口の見た目は綺麗にしたいので、ちょっと手を加えることにしました。

ルーティング設定

まず、下記ルーティングを実現させました。

localhost:3000/にアクセスするとトップページが表示できるようにルーティングの変更を実施しました。

トップページには、新規登録とログインのボタンだけ配置し、そこから認証することでサイト内にアクセスできるように設定。

ログインせずに内部にアクセスしても強制的にログイン画面に遷移するようにしました。

ルーティング情報はこのようになりました。

# ~/routes/web.php

f:id:Fippiy:20190323145201p:plain

ルーティング

Auth::routes();←これがAuthクラス関連のルーティング設定です、初めに実施したAuth利用の為のコマンド実施時に自動的に作成されています。

新規登録・ログインの初期画面についてもこちらでルートは生成済みです。

あとは、トップページの表示先をreturn view('index');でLaravel標準のWelcomeに変更したという作業を実施。

トップページ作成

次にトップページのビューを作成しました。

先程のretrun view('index);のページです。

# ~resource/views/index.blade.php 

f:id:Fippiy:20190323151143p:plain

トップページコード

 

タイトル名と新規登録・ログインボタンだけのサイトです。

見た目を検討する為にdivで箱をたくさん作っていますが、表示はシンプルな物です。

 新規登録とログインについては、標準で作成されたページへのリンクを設定しています。

ログアウト処理

登録ページはリンクだけ貼って飛ばしてしまえば簡単だったのですが、ログアウトについては標準のテンプレートでなく、作成済みのサイトにリンクを設置したかったので、まず動作をチェックしました。

標準Auth関連の動作については、こちらを参考にさせて頂きました。ありがとうございます。

qiita.com

 ログアウトの部分について自動生成されていたレイアウトから確認し、ログアウトリンクに適用させることにしました。

 # ~resource/views/index.blade.php 

f:id:Fippiy:20190323151522p:plain

ログアウト処理

正直なところを申しますと、Authクラスが自動生成されたレイアウトのログアウト処理をほぼ流用してます。

ログアウト処理の為、POST送信が必要でありform送信で記述しています。最初は単純にログアウトへリンクさえ貼ればいいと考えていたのですが、getメソッドは許容しないエラーが返ってきました。

リンクに直接POST指定できればよかったのですが、いい方法が見つかりませんでしたのでこのような形としています。