Laravel-Entwicklung: Wie stellt man mit Laravel Sanctum eine API-Authentifizierung für SPA bereit?

Laravel-Entwicklung: Wie kann ich mit Laravel Sanctum eine API-Authentifizierung für SPA bereitstellen?

Angesichts der Popularität von Single Page Applications (SPA) benötigen wir eine zuverlässige Möglichkeit, unsere APIs vor unbefugtem Zugriff und Angriffen zu schützen. Laravel Sanctum ist ein leichtes Authentifizierungssystem von Laravel, das eine einfache Authentifizierung für SPA ermöglicht. In diesem Artikel erfahren Sie, wie Sie mit Laravel Sanctum eine API-Authentifizierung für Ihr SPA bereitstellen.

Verwendung von Laravel Sanctum

Laravel Sanctum ist ein offizielles Paket in der Laravel 7.x-Version für die API-Authentifizierung. Laravel Sanctum verwendet das API-Token, um den Benutzer zu identifizieren, und kann mithilfe des Tokens problemlos mehrere Authentifizierungs-Builds durchführen.

Installieren Sie Laravel Sanctum

Stellen Sie zunächst sicher, dass das Laravel-Framework installiert ist.

Um Laravel Sanctum zu installieren, können Sie den folgenden Befehl verwenden:

composer require laravel/sanctum

Fügen Sie den ServiceProvider zur Anbieterliste in der Datei config/app.php hinzu.

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

],

Jetzt können Sie die folgenden Befehle ausführen, um die erforderlichen Datenbankmigrationen und die Sanctum-Konfiguration zu veröffentlichen.

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

Führen Sie den folgenden Befehl aus, um die Migration auszuführen:

php artisan migrate

Verwenden Sie Sanctum für die Standardauthentifizierung.

Sanctum enthält Standardimplementierungen für die API- und Single Page Application-Authentifizierung. Die Standardauthentifizierung kann mithilfe der SanctumTraitsHasApiTokens-Eigenschaft für das Benutzermodell aktiviert werden.

HasApiTokens-Merkmal zum Benutzermodell hinzufügen

<?php

namespace AppModels;

use IlluminateFoundationAuthUser as Authenticatable;
use IlluminateNotificationsNotifiable;
use LaravelSanctumHasApiTokens;

class User extends Authenticatable
{
    use Notifiable, HasApiTokens;

    // ...
}

Zur besseren Erklärung verwenden wir ein einfaches SPA-Beispiel. Gehen Sie davon aus, dass die Beispiel-URL http://spa.test lautet und die API über http://api.spa.test verfügbar gemacht wird.

CORS in Laravel konfigurieren

Fügen Sie den folgenden Code zur Datei app/Providers/AppServiceProvider.php hinzu, um die ursprungsübergreifende gemeinsame Nutzung von Ressourcen (CORS) zu ermöglichen.

...
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,
            ]]);
        }
    }
}

Ersetzen Sie http://spa.test im obigen Code durch die URL Ihres SPA.

Token-Validierungs- und API-Schutzanweisungen

Im Controller können wir die Authentifizierungs-Middleware von Sanctum verwenden, um die Route zu sichern

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();
    // ...
}

Dadurch wird das Sanctum-Autorisierungstoken aus dem Anforderungsheader abgerufen und dieses Token zur Authentifizierung des Benutzers verwendet. Wenn das Autorisierungstoken nicht im Header angegeben ist, wird der Fehler 401 Unauthorized zurückgegeben.

Autorisierungs-Token-Anfrage stellen

In unserem SPA können wir die Axios-Bibliothek verwenden, um die API zu verwenden und das Token zu erhalten. Um das Autorisierungstoken zu erhalten, müssen wir zuerst das CSRF-Token abrufen, also müssen wir eine GET-Anfrage senden, um es zu erhalten.

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' });
    });
});

Der obige Code stellt eine POST-Anfrage in http://api.spa.test, erstellt ein neues Sanctum-Autorisierungstoken auf dem Server und antwortet mit dem Token als „response.data.token“. Anschließend können wir das Token zum gemeinsamen Header von axios hinzufügen, um es im SPA für alle nachfolgenden Anfragen zu verwenden.

Beachten Sie, dass in diesem Beispiel davon ausgegangen wird, dass es eine Route mit dem Namen „login“ gibt.

Sanctum bietet uns auch eine Abmelderoute zum Widerrufen von Autorisierungstokens.

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

Fazit

Laravel Sanctum ist ein leichtes, einfaches und praktisches Authentifizierungssystem, das einfach zu integrieren und zu verwenden ist und Standardauthentifizierungsfunktionen bietet, was es zu einer hervorragenden Lösung für die SPA-Authentifizierung macht. Sobald Sie Sanctum verwenden, müssen Sie kein eigenes Authentifizierungssystem mehr schreiben. Dadurch können wir schnell eine sichere Authentifizierung für unsere API implementieren und unsere SPA kann in einem Bruchteil der Zeit mit der API interagieren.

Das obige ist der detaillierte Inhalt vonLaravel-Entwicklung: Wie stellt man mit Laravel Sanctum eine API-Authentifizierung für SPA bereit?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!