PHP開發：使用 Laravel Sanctum 實現 SPA 應用安全認證

Laravel Sanctum 是一個 Laravel 框架官方推薦的輕量級使用者認證庫，它旨在為單頁應用程式（SPA）和行動應用程式提供簡單而現代的身份驗證。本文將介紹如何使用 Laravel Sanctum 實現 SPA 應用的安全認證。

一、安裝Laravel
首先需要安裝Laravel，可以透過composer 安裝最新版本的Laravel：

composer create-project --prefer-dist laravel/laravel your-project-name

二、設定Sanctum
安裝好Laravel 之後需要進行Sanctum 的設定，請先執行以下指令：

composer require laravel/sanctum

在Laravel 5.5 以下版本中，需要在config/app.php 檔案中加入服務提供者和門面：

'providers' => [

...
LaravelSanctumSanctumServiceProvider::class,

],

'aliases' => [

...
'Sanctum' => LaravelSanctumSanctum::class,

],

在Laravel 5.5 以上版本中，無需手動新增服務提供者或門面。

接著需要執行資料庫遷移以建立Sanctum 所需的表格：

php artisan migrate

如果您的應用程式需要使用SPA 驗證，則應在config/ cors.php 檔案中新增您的應用程式網域和信任的網域。在下面的範例中，我們假設您正在建立一個具有前端應用程式的後端API：

'paths' => ['api/*', 'sanctum/csrf-cookie'],

'allowed_methods' => ['*'],

'allowed_origins' => ['http://your-app-url.com'],

'allowed_origins_patterns' => [],

'allowed_headers' => ['*'],

'exposed_headers' => false,

'max_age ' => false,

'supports_credentials' => true,

三、建立API 和認證控制器
在resources/views 中建立一個index.blade.php 文件，用於顯示SPA 介面。

在 routes/api.php 中編寫 API 路由。我們在這裡建立一個測試路由，傳回目前認證使用者的使用者資訊：

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {

return $request->user();

});

接下來，我們需要新增一個特定於SPA 應用程式的控制器，以建立和管理Sanctum 令牌。這個控制器負責建立令牌並為使用者簽發身份驗證 cookie。

首先在app/Http/Controllers 資料夾中建立一個API 控制器，例如AuthController：

php artisan make:controller API/AuthController

#然後在AuthController 中加入register 與login 方法：

public function register(Request $request)
{

$request->validate([
    'name' => 'required|string|max:255',
    'email' => 'required|string|email|unique:users|max:255',
    'password' => 'required|string|min:8|confirmed'
]);

$user = new User([
    'name' => $request->name,
    'email' => $request->email,
    'password' => Hash::make($request->password)
]);

$user->save();

return response()->json([
    'message' => 'Successfully registered'
], 201);

}

public function login(Request $request)
{

$request->validate([
    'email' => 'required|string|email',
    'password' => 'required|string',
    'remember_me' => 'boolean'
]);

$credentials = request(['email', 'password']);

if (!Auth::attempt($credentials)) {
    return response()->json([
        'message' => 'Unauthorized'
    ], 401);
}

$user = $request->user();

$tokenResult = $user->createToken('Personal Access Token');

$token = $tokenResult->token;

if ($request->remember_me) {
    $token->expires_at = Carbon::now()->addWeeks(1);
}

$token->save();

return response()->json([
    'access_token' => $tokenResult->accessToken,
    'token_type' => 'Bearer',
    'expires_at' => Carbon::parse(
        $tokenResult->token->expires_at
    )->toDateTimeString()
]);

}

四、處理身份驗證
現在，您已經擁有了創建Token、用戶註冊和用戶登入的所有必要程式碼，下面我們將開始建立身份驗證過程。

SPA 應用程式使用 Sanctum 發送 POST 請求，透過 email 和 password 參數驗證使用者憑證。如果驗證成功，則應用程式將接收到 OAuth Token。

使用 SPA 應用程式時，在 headers 中新增 Authorization: Bearer ，可以透過應用程式路由存取受保護的 API。

完成身份驗證後，您可以透過 Sanctum 使用身份驗證路由取得目前身份驗證使用者的資訊。例如，我們可以使用以下程式碼檢索目前驗證使用者的名稱：

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {

return $request->user()->name;

});

五、建立相關頁面和元件
請務必確保您的Laravel 入口點檔案包含必要的JavaScript 程式庫（這裡使用Vue.js、Vue Router 和Axios ）。在resources/js/app.js 檔案中，定義Vue 元件：

require('./bootstrap');

import Vue from 'vue';
import App from ' ./views/App';
import router from './router';
import store from './store';

Vue.component('App', App);

const app = new Vue({

el: '#app',
router,
store

});

#建立資源資料夾views 和views/App.vue，新增必要的元件（登入表單、登錄檔等）。在 views 資料夾中建立需要的所有頁面元件。

這裡為了示範方便，程式碼量略多，請自行查閱 Laravel 官方文件。

六、重構API 路由和AckController
更新API 路由，將SPA 路由對應到AckController，同時確保中介軟體會使用Sanctum 設定：

Route::middleware('auth :sanctum')->get('/user', function (Request $request) {

return $request->user();

});

Route::post('/register', 'APIAuthController@ register');
Route::post('/login', 'APIAuthController@login');

Route::middleware('auth:sanctum')->get('/spa/ {any}', function () {

return view('index');

})->where('any', '.*');

我們在AckController 中加入forgotPassword 和resetPassword 方法，用於處理使用者忘記密碼以及回應密碼重設連結的請求：

public function forgotPassword(Request $request)
{

$request->validate(['email' => 'required|email']);

$user = User::where('email', $request->email)->first();

if (!$user) {
    return response()->json([
        'message' => 'We could not find your account'
    ], 404);
} else {
    $user->sendPasswordResetNotification($request->email);
}

return response()->json([
    'message' => 'We have e-mailed your password reset link!'
]);

}

##public function resetPassword( Request $request)

{

$request->validate([
    'email' => 'required|email',
    'token' => 'required|string',
    'password' => 'required|string|confirmed|min:8'
]);

$resetPasswordStatus = Password::reset($request->only('email', 'password', 'password_confirmation', 'token'), function ($user, $password) {
    $user->forceFill([
        'password' => Hash::make($password)
    ])->save();
});

if ($resetPasswordStatus === Password::INVALID_TOKEN) {
    return response()->json(['message' => 'The reset token is invalid']);
}

return response()->json(['message' => 'Your password has been updated']);

}

七、新增路由
在 Laravel Sanctum 中，需要設定路由以啟用身份驗證、CSRF 保護和錯誤保護，使用 groban/laravel-livewire 實現 SPA 應用的路由。

八、執行SPA 應用程式
完成上述步驟後，我們可以使用下列指令執行SPA 應用程式：

npm run dev

在瀏覽器中開啟運行的設備上的主機IP 位址或URL 來查看SPA 應用程式。

最後，我們已經成功地使用 Laravel Sanctum 實現了SPA應用的安全認證。透過這種方法，可以確保應用程式資料的安全，防止未經授權的存取和保護私有資訊。

以上是PHP開發：使用 Laravel Sanctum 實現 SPA 應用安全認證的詳細內容。更多資訊請關注PHP中文網其他相關文章！