PHP

Laravel 6 建立含有使用者註冊、登入認證功能的網頁專案教學

介紹如何使用 Laravel 6 快速自動建立含有使用者註冊與登入認證功能的網頁專案。

建立 Laravel 專案

在安裝好 Laravel 6 的環境中，使用 laravel 指令建立一個新的 Laravel 專案：

# 建立 Laravel 專案
laravel new myProj

接著進入專案目錄：

# 進入專案目錄
cd myProj

安裝 Laravel 的 ui 工具套件：

# 安裝 laravel/ui 套件
composer require laravel/ui --dev

建立含有使用者認證的框架，有 bootstrap、vue 與 React 三種版本可以選擇，任選一種即可：

# 建立含有使用者認證的框架（bootstrap 版本）
php artisan ui bootstrap --auth

# 建立含有使用者認證的框架（vue 版本）
php artisan ui vue --auth

# 建立含有使用者認證的框架（React 版本）
php artisan ui react --auth

安裝相依性套件並編譯：

# 安裝相依性套件並編譯
npm install && npm run dev

設定 MySQL/MariaDB 資料庫

以 MySQL/MariaDB 資料庫管理者帳號，進入 MySQL/MariaDB 資料庫，建立 Laravel 專案使用的資料庫與使用者帳號，並且設定好權限：

-- 建立 Laravel 網頁專案用的資料庫
CREATE DATABASE laravel;

-- 建立使用者帳號
CREATE USER laravel@localhost IDENTIFIED BY 'your_password';

-- 設定使用者權限
GRANT ALL PRIVILEGES ON laravel.* TO laravel@localhost;

編輯 Laravel 專案目錄中的 .env 設定檔，填入 MySQL/MariaDB 資料庫的設定：

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=laravel
DB_PASSWORD=your_password

在 Laravel 專案目錄中，以 migrate 在 MySQL/MariaDB 資料庫中自動建立 Laravel 專案用的資料表：

# 建立資料庫結構
php artisan migrate

migrate 會根據 database/migrations 目錄下的設定檔，自動在資料庫中建立專案需要的資料表，如果想要新增或修改資料表結構，都要從 migrations 的設定下手，不要直接在資料庫中修改。

若要將 migrate 所做的動作復原，可用 migrate:rollback：

# 復原資料庫結構
php artisan migrate:rollback

啟動網頁伺服器

在 Laravel 專案目錄之下，執行開發用的網頁伺服器，並設定使用 18000 連接埠：

# 執行網頁伺服器
php artisan serve --port=18000

Laravel development server started: http://127.0.0.1:18000

用瀏覽器開啟顯示的網址，即可看到含有使用者註冊、登入等功能網站架構了。

首頁

這是 Laravel 自動產生的使用者登入網頁。

使用者登入畫面

這是 Laravel 自動產生的使用者註冊網頁，填入資料之後即可連結資料庫，自動新增使用者。

使用者註冊畫面

這是使用者註冊並登入後的畫面。

使用者登入後畫面

啟用 Email 信箱認證

使用者在註冊帳號之後，不需要任何驗證就可以直接使用新帳號登入，如果希望驗證使用者的 Email 信箱是否正確，可以在 routes/web.php 設定檔中，啟用 Email 信箱認證：

# 啟用 Email 認證功能
Auth::routes(['verify' => true]);

停用使用者註冊功能

若使用 Laravel 6 自動建立的網頁專案，預設會啟用使用者註冊功能，任何人近來都可以註冊並登入，若希望停用使用者註冊功能，也可以在 routes/web.php 設定檔中設定：

# 停用使用者註冊功能
Auth::routes(['register' => false]);

而在停用使用者註冊功能之後，一般人就無法註冊新帳號，若管理者需要新增帳號，可以透過 Tinker 互動式指令環境來新增使用者：

# 進入 Tinker 互動式指令環境
php artisan tinker

然後在 Tinker 環境中，以一般的 PHP 語法直接新增使用者：

# 新增使用者
$user = new AppUser();
$user->password = Hash::make('your_password');
$user->email = 'user@example.com';
$user->name = 'Your Name';
$user->save();

除此之外亦可參考 app/Http/Controllers/Auth/RegisterController.php 中的作法，撰寫給管理者新增使用者的功能。

常見問題

如果在執行 migrate 的時候，遇到這樣的錯誤：

IlluminateDatabaseQueryException  : SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes (SQL: alter table `users` add unique `users_email_unique`(`email`))

可以修改 app/Providers/AppServiceProvider.php，設定預設字串長度，即可解決此問題：

use IlluminateSupportFacadesSchema;

class AppServiceProvider extends ServiceProvider
{
    # ...

    public function boot()
    {
        // 設定預設字串長度
        Schema::defaultStringLength(191);
    }
}