Laravel開發(fā)：如何使用Laravel Sanctum為SPA提供API驗(yàn)證？

隨著單頁(yè)應(yīng)用程式（SPA）的流行，我們需要一種可靠的方法來保護(hù)我們的API免受未經(jīng)授權(quán)的存取和攻擊。 Laravel Sanctum是Laravel提供的一個(gè)輕量級(jí)的認(rèn)證系統(tǒng)，它為SPA提供輕鬆的身份驗(yàn)證。本文將向您展示如何使用Laravel Sanctum為SPA提供API驗(yàn)證。

使用Laravel Sanctum

Laravel Sanctum是Laravel 7.x版本中的官方包，用於API驗(yàn)證。 Laravel Sanctum使用該API的Token來識(shí)別使用者身份，並且可以透過使用token輕鬆執(zhí)行多個(gè)身份驗(yàn)證的建置。

安裝Laravel Sanctum

首先，需確保已安裝Laravel框架。

要安裝laravel sanctum，可以使用下列指令

composer require laravel/sanctum

將ServiceProvider加入config/app.php檔案的providers清單。

'providers' => [
    // ...
    LaravelSanctumSanctumServiceProvider::class,

],

現(xiàn)在，可以執(zhí)行以下命令發(fā)布必要的資料庫(kù)遷移和Sanctum配置。

php artisan vendor:publish --provider="LaravelSanctumSanctumServiceProvider"

執(zhí)行以下命令以執(zhí)行遷移：

php artisan migrate

使用Sanctum進(jìn)行預(yù)設(shè)驗(yàn)證

Sanctum包含API和單頁(yè)應(yīng)用程式驗(yàn)證的預(yù)設(shè)實(shí)作?？梢酝高^為使用者模型使用SanctumTraitsHasApiTokens trait來啟用預(yù)設(shè)身份驗(yàn)證。

將HasApiTokens trait加入到使用者模型

<?php

namespace AppModels;

use IlluminateFoundationAuthUser as Authenticatable;
use IlluminateNotificationsNotifiable;
use LaravelSanctumHasApiTokens;

class User extends Authenticatable
{
    use Notifiable, HasApiTokens;

    // ...
}

為了更好的解釋，我們將使用一個(gè)簡(jiǎn)單的SPA範(fàn)例。假設(shè)範(fàn)例的URL為http://spa.test和透過http://api.spa.test公開的API。

在Laravel中設(shè)定CORS

將下面的程式碼加入app/Providers/AppServiceProvider.php檔案中來允許跨網(wǎng)域資源共用（CORS）。

...
use IlluminateSupportFacadesSchema;
use IlluminateSupportFacadesURL;

class AppServiceProvider extends ServiceProvider
{
    public function boot()
    {
        Schema::defaultStringLength(191);

        if (config('app.env') === 'production') {
            URL::forceScheme('https');
        }

        $headers = [
            'Access-Control-Allow-Origin' => '*',
            'Access-Control-Allow-Methods' => 'POST, GET, OPTIONS, PUT, DELETE',
            'Access-Control-Allow-Headers' => 'Origin, Content-Type, Accept, Authorization, X-Request-With',
            'Access-Control-Allow-Credentials' => 'true',
        ];
        $this->app['router']->middleware('api')->get('/sanctum/csrf-cookie', function () {
            return response()->json(['status' => 'success']);
        });

        foreach ($headers as $key => $value) {
            config(['cors.supportsCredentials' => true]);
            config(['cors.paths.api/*' => [
                'allowedOrigins' => ['http://spa.test'],
                'allowedHeaders' => [$key],
                'allowedMethods' => ['*'],
                'exposedHeaders' => [],
                'maxAge' => 86400,
            ]]);
        }
    }
}

將上述程式碼中的http://spa.test替換為您的SPA的URL。

令牌驗(yàn)證和API保護(hù)說明

在控制器中，我們可以使用Sanctum的auth中間件來保護(hù)路由

public function index(Request $request)
{
    $user = $request->user();
    // ...
}

public function store(Request $request)
{
    $user = $request->user();
    // ...
}

public function destroy(Request $request, string $id)
{
    $user = $request->user();  
    // ...
}

public function update(Request $request, string $id)
{
    $user = $request->user();
    // ...
}

這會(huì)從請(qǐng)求標(biāo)頭中獲取Sanctum授權(quán)令牌，並使用該令牌驗(yàn)證使用者。如果未在標(biāo)頭中提供授權(quán)令牌，則將傳回401未經(jīng)授權(quán)的錯(cuò)誤。

發(fā)出授權(quán)令牌請(qǐng)求

在我們的SPA中，我們可以使用axios函式庫(kù)來使用API??並取得令牌。要取得授權(quán)令牌，我們需要先取得CSRF令牌，所以我們需要傳送一個(gè)GET請(qǐng)求來取得它。

axios.get('http://api.spa.test/sanctum/csrf-cookie').then(response => {
    axios.post('http://api.spa.test/login', {
        username: this.username,
        password: this.password
    }).then(response => {
        axios.defaults.headers.common['Authorization'] = `Bearer ${response.data.token}`;
        this.$router.push({ name: 'home' });
    });
});

上面的程式碼將在http://api.spa.test中發(fā)出POST請(qǐng)求，在伺服器上建立一個(gè)新的Sanctum授權(quán)令牌，並將令牌作為response.data.token進(jìn)行回應(yīng)。此後，我們可以將令牌新增至axios的通用頭檔中，以在SPA中使用所有後續(xù)請(qǐng)求。

注意，此範(fàn)例假設(shè)有一個(gè)名為「login」的路由。

Sanctum也為我們提供了一個(gè)logout路由來撤銷授權(quán)令牌。

axios.post('http://api.spa.test/logout').then(response => {
    delete axios.defaults.headers.common['Authorization'];
    this.$router.push({ name: 'login' });
});

結(jié)論

Laravel Sanctum是一個(gè)輕量級(jí)的簡(jiǎn)單實(shí)用的身份驗(yàn)證系統(tǒng)，它易於整合和使用，並提供預(yù)設(shè)的身份驗(yàn)證功能，是SPA身份驗(yàn)證的絕佳解決方案。一旦您與Sanctum一起使用，您將不再需要編寫自己的身份驗(yàn)證系統(tǒng)。它能夠讓我們?yōu)槲覀兊腁PI快速實(shí)現(xiàn)安全的身份驗(yàn)證，並讓我們的SPA與API在很短的時(shí)間內(nèi)互動(dòng)。

以上是Laravel開發(fā)：如何使用Laravel Sanctum為SPA提供API驗(yàn)證？的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！