Laravel-Entwicklung: Wie implementiert man SPA- und API-Authentifizierung mit Laravel Sanctum?-Laravel-php.cn

Laravel-Entwicklung: Wie implementiert man SPA- und API-Authentifizierung mit Laravel Sanctum?

WBOY

Freigeben： 2023-06-13 12:36:10

Original

1120 Leute haben es durchsucht

Laravel Sanctum ist ein leichtes Authentifizierungspaket, mit dem Sie problemlos API-Authentifizierung und SPA-Authentifizierung (Single Page Application) in Laravel-Anwendungen implementieren können. In diesem Artikel erfahren Sie, wie Sie mit Laravel Sanctum die SPA- und API-Authentifizierung implementieren.

Lass uns zunächst sehen, was SPA- und API-Zertifizierung ist.

SPA-Zertifizierung bezieht sich auf eine Einzelseitenanwendung, die nicht die gesamte Seite neu lädt, sondern mithilfe von AJAX Informationen vom Webserver anfordert, um Teilinhalte zu aktualisieren. Bei Verwendung von SPA müssen APIs authentifiziert werden, um sicherzustellen, dass nur authentifizierte Benutzer darauf zugreifen können.

API-Authentifizierung bezieht sich auf den API-Anforderungsauthentifizierungsprozess. Wenn ein Client eine Anfrage sendet, muss die API überprüfen, ob die Anfrage vom erwarteten Benutzer stammt, um sicherzustellen, dass der API-Endpunkt nur von authentifizierten Benutzern verwendet wird.

Hier sind die Schritte zur Verwendung von Laravel Sanctum zur Implementierung der SPA- und API-Authentifizierung:

1. Installieren Sie Laravel Sanctum
Wir können den Composer-Paketmanager verwenden, um Laravel Sanctum zu installieren. Führen Sie den folgenden Befehl im Laravel-Projekt aus:

composer require laravel/sanctum

Nach dem Login kopieren

2. Führen Sie das Laravel Sanctum-Installationsprogramm aus.
Laravel Sanctum bietet ein Installationsprogramm, das unsere Anwendung während der Installation automatisch konfiguriert. Wir können dieses Installationsprogramm mit dem folgenden Befehl ausführen:

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

Nach dem Login kopieren

3. Migrationen ausführen
Wir müssen Sanctum-Migrationen ausführen, um die erforderlichen Datenbanktabellen zur Unterstützung von Sanctum-Vorgängen zu erstellen. Führen Sie den folgenden Befehl aus:

php artisan migrate

Nach dem Login kopieren

4. Konfigurieren Sie die Anwendung
Wir müssen Laravel Sanctum zu unserem Middleware-Stack hinzufügen:

'api' => [
    'middleware' => ['auth:sanctum'],
    'throttle:60,1',
    'prefix' => 'api',
    'namespace' => 'AppHttpControllersAPI',
],

Nach dem Login kopieren

5. Stellen Sie dem Benutzer ein Authentifizierungstoken aus
In Laravel Sanctum können wir die tokenCan-Methode verwenden. Überprüfen Sie, ob Das Token verfügt über bestimmte API-Berechtigungen. Mit der Methode „createToken“ können wir dem Benutzer ein Authentifizierungstoken ausstellen:

use IlluminateHttpRequest;

/**
 * Store a newly created resource in storage.
 *
 * @param  IlluminateHttpRequest  $request
 * @return IlluminateHttpResponse
 */
public function store(Request $request)
{
    $user = User::find(1);
    $token = $user->createToken('token-name', ['server:update'])->plainTextToken;

    return response()->json([
        'access_token' => $token,
        'token_type' => 'Bearer',
    ]);
}

Nach dem Login kopieren

Dadurch wird ein Token für den Benutzer namens „token-name“ mit server:update-Berechtigungen erstellt.

6. API-Endpunkte schützen
In unserem Controller können wir die „Middleware“-Methode verwenden, um die API-Endpunkte zu schützen:

public function update(Request $request, $id)
{
    if (!$request->user()->tokenCan('server:update')) {
        abort(403, 'Unauthorized');
    }

    // Update the server
}

Nach dem Login kopieren

In diesem Beispiel erlauben wir nur Benutzern mit server:update-Berechtigungen, auf die Update-Methode zuzugreifen.

7. Verwendung von Authentifizierungstoken in SPA
In unserem SPA können wir die @auth- und @csrf-Blade-Anweisungen von Sanctum verwenden, um das Authentifizierungstoken zu erhalten:

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Laravel</title>

    <!-- Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet">
    <script src="{{ asset('js/app.js') }}" defer></script>

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">

    <!-- Meta -->
    <meta name="csrf-token" content="{{ csrf_token() }}">
</head>
<body>
    <div id="app">
        <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
            <div class="container-fluid">
                <a class="navbar-brand" href="{{ url('/') }}">
                    {{ config('app.name', 'Laravel') }}
                </a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <!-- Left Side Of Navbar -->
                    <ul class="navbar-nav mr-auto">

                    </ul>

                    <!-- Right Side Of Navbar -->
                    <ul class="navbar-nav ml-auto">
                        <!-- Authentication Links -->
                        @guest
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
                            </li>
                            @if (Route::has('register'))
                                <li class="nav-item">
                                    <a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
                                </li>
                            @endif
                        @else
                            <li class="nav-item dropdown">
                                <a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
                                    {{ Auth::user()->name }}
                                </a>

                                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
                                    <a class="dropdown-item" href="{{ route('logout') }}"
                                       onclick="event.preventDefault();
                                                     document.getElementById('logout-form').submit();">
                                        {{ __('Logout') }}
                                    </a>

                                    <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                                        @csrf
                                    </form>
                                </div>
                            </li>
                        @endguest
                    </ul>
                </div>
            </div>
        </nav>
        <main class="py-4">
            @yield('content')
        </main>
    </div>
    @auth
        <script>
            window.Laravel = {!! json_encode([
                'csrf_token' => csrf_token(),
                'api_token' => Auth::user()->api_token
            ]) !!};
        </script>
    @endauth
</body>

Nach dem Login kopieren

In diesem Beispiel haben wir die @auth- und @csrf-Blade-Anweisungen von Sanctum verwendet Wird verwendet, um Benutzerauthentifizierungstoken und CSRF-Tokens zu erhalten.

Hier geht es um die Implementierung der SPA- und API-Authentifizierung mit Laravel Sanctum. Die Verwendung von Laravel Sanctum erleichtert die Sicherung unserer API-Endpunkte und SPA-Anwendungen und hilft uns bei der Implementierung bester Sicherheitspraktiken.

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