這章節開始要介紹用戶登入相關的用法，先認識 驗證(Authentication) 及 授權(Authorization) ，這兩個差別在哪？

驗證(Authentication) 是確認是否有這個用戶。
未通過驗證，回傳 401 Unauthorized

授權(Authorization) 則是用戶是否有權限做這件事情。
通過驗證但未授權，回傳403 Forbidden

用戶驗證(Authentication)

想要一口氣踏入 Laravel 專案嗎？ 當你要建立一個會員登入，建立完就過了兩週，這時候不用這麼麻煩，Laravel 提供的登入機制，只要10分鐘，就可以完成。

用戶登入需要的功能，分成四部份

  1. 用戶註冊
  2. 用戶登入
  3. 用戶登出
  4. 用戶密碼重設

前置作業

驗證的配置設定都在 專案 > config > auth.php 這裡面。

建立 Laravel 專案

1
$ laravel new auth

進入專案

1
$ cd auth

啟動內建伺服器

1
$ php artisan serve

專案的起始頁面

加入身分驗證功能

利用 Composer 安裝 UI 的套件

1
$ composer require laravel/ui --dev

建立含有用戶驗證的框架，分別為 Bootstrap、Vue、React 三種，這邊我以 Bootstrap 當範例

  • laravel 6 以下執行 php artisan make:auth
  • laravel 6 以上執行 指令其中一個即可，6以上 laravel 將他做分離了。
1
2
3
4
5
$ php artisan ui bootstrap --auth

$ php artisan ui vue --auth

$ php artisan ui react --auth

以上步驟其實可以省略(但他會使用 Vue 的框架去建立用戶驗證)

1
$ laravel new 專案名稱 --auth

專案可能原先需要安裝的套件並編譯

1
$ npm install && npm run dev

建立完成增加的檔案

Views 會增加 8 支 Blade模板
專案 > resources > views

  1. auth > login.blade.php
  2. auth > register.blade.php
  3. auth > verify.blade.php
  4. auth > passwords > confirm.blade.php
  5. auth > passwords > email.blade.php
  6. auth > passwords > reset.blade.php
  7. layouts > app.blade.php
  8. home.blade.php

Controllers 會增加約 7 支程式
專案 > app > Http > Controllers

  1. Auth > ConfirmPasswordController.php
  2. Auth > ForgotPasswordController.php (忘記用戶密碼)
  3. Auth > LoginController.php (用戶登入)
  4. Auth > RegisterController.php (用戶註冊)
  5. Auth > ResetPasswordController.php (用戶密碼重設)
  6. Auth > VerificationController.php
  7. HomeController.php

Model 的部分，建立專案時已經建好 專案 > app > User.php

建立資料庫及設置資料庫連線

我是用 MySQL 提供的 WorkBench 去做資料庫的管理，登入的部分請自行設定，這邊我就省略介紹。

登入建立一個資料庫
名稱：auth
編碼：utf8_general_ci

回到專案裡，開啟 .env 檔案，修改 DB_DATABASE(資料庫名稱)、DB_USERNAME(資料庫伺服器帳號)、DB_PASSWORD(資料庫伺服器密碼)

Laravel 專案 > .env

1
2
3
4
5
6
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=auth
DB_USERNAME=root
DB_PASSWORD=bPPVnyRbh7YBeONl

建立資料表

Laravel 專案裡已經幫我們寫好 migration，我們只要執行它就可以了
Laravel 專案 > database > migrations

執行 migration

1
$ php artisan migrate

回到資料庫重新整理，剛剛建立的資料表都出現了

啟動內建伺服器

1
$ php artisan serve

右上角就會出現 LOGIN、REGISTER 的連結。

點進 Login

點進 Regidter

註冊完成，顯示的畫面

取消註冊功能

有些人可能不需要用戶註冊功能，只要做兩個步驟

  1. 刪除 專案 > app > Http > Controllers > Auth > RegisterController.php
  2. Auth::routes(); 改成 Auth::routes(['register' => false]);，不顯示註冊

專案 > routes > web.php

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php

use Illuminate\Support\Facades\Route;

// 註解省略

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

Auth::routes(['register' => false]);

Route::get('/home', 'HomeController@index')->name('home');

結果

啟用 Email 信箱驗證

  1. 修改 class User extends Authenticatable 改成 class User extends Authenticatable implements MustVerifyEmail
  2. Auth::routes(); 改成 Auth::routes(['verify' => true]);，不顯示註冊
  3. Email 伺服器 .env 設置，刪掉MAIL_FROM_ADDRESS 及 MAIL_FROM_NAME。

專案 > app > User.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php

namespace App;

use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;

class User extends Authenticatable implements MustVerifyEmail
{
    use Notifiable;

    protected $fillable = [
        'name', 'email', 'password',
    ];

    protected $hidden = [
        'password', 'remember_token',
    ];

    protected $casts = [
        'email_verified_at' => 'datetime',
    ];
}

專案 > routes > web.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php

use Illuminate\Support\Facades\Route;

// 註解省略

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

# 註冊成功，寄發認證信
Auth::routes(['verify' => true]);

Route::get('/home', 'HomeController@index')->name('home');

專案 > .env

1
2
3
4
5
6
MAIL_MAILER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=xxxxxxx@gmail.com
MAIL_PASSWORD=xxxxxxx
MAIL_ENCRYPTION=tls

信箱收信結果

結論

以上就是簡單的快速登入頁面，但下一章節會介紹 Email 寄信的方法，會再一一介紹登入該注意的部分及用法。

標籤: w3HexSchool PHP Laravel