PHP FrameworkLaravelLaravel development: How to implement SPA and API authentication using Laravel Sanctum?Laravel development: How to implement SPA and API authentication using Laravel Sanctum?
Laravel Sanctum is a lightweight authentication package that allows you to easily implement API authentication and SPA (Single Page Application) authentication in Laravel applications. In this article, we will explore how to use Laravel Sanctum to implement SPA and API authentication.
First, let’s take a look at what SPA and API authentication are.
SPA certification refers to a single-page application that does not reload the entire page, but uses AJAX to request information from the web server to update partial content. When using SPA, APIs need to be authenticated to ensure that only authenticated users can access them.
API authentication refers to the API request authentication process. When a client sends a request, the API needs to verify that the request is from the expected user, thereby ensuring that the API endpoint is only used by authenticated users.
Here are the steps on how to use Laravel Sanctum to implement SPA and API authentication:
1. Install Laravel Sanctum
We can use the composer package manager to install Laravel Sanctum. Run the following command in the Laravel project:
composer require laravel/sanctum
2. Run the Laravel Sanctum installer
Laravel Sanctum provides an installer that can automatically configure our application during installation. We can run this installer using the following command:
php artisan vendor:publish --provider="LaravelSanctumSanctumServiceProvider"
3. Run migration
We need to run Sanctum migration to create the necessary database tables to support Sanctum operations. Run the following command:
php artisan migrate
4. Configure the application
We need to add Laravel Sanctum to our middleware stack:
'api' => [
'middleware' => ['auth:sanctum'],
'throttle:60,1',
'prefix' => 'api',
'namespace' => 'AppHttpControllersAPI',
],5. Issue authentication tokens to users
In Laravel Sanctum, we can use the tokenCan method to check whether a token has specific API permissions. We can issue an authentication token to the user using the createToken method:
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',
]);
}This will create a token named 'token-name' for the user, which has server:update permissions.
6. Protect API endpoints
In our controller, we can use the "middleware" method to protect API endpoints:
public function update(Request $request, $id)
{
if (!$request->user()->tokenCan('server:update')) {
abort(403, 'Unauthorized');
}
// Update the server
}In this example, we only allow those with Users with server:update permissions access the update method.
7. Using authentication tokens in SPA
In our SPA, we can use Sanctum’s @auth and @csrf Blade instructions to obtain the authentication token:
<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>In this example, we use Sanctum's @auth and @csrf Blade directives to obtain user authentication tokens and CSRF tokens.
That’s all about how to implement SPA and API authentication using Laravel Sanctum. Using Laravel Sanctum makes it easy to secure our API endpoints and SPA applications and helps us implement best security practices.
The above is the detailed content of Laravel development: How to implement SPA and API authentication using Laravel Sanctum?. For more information, please follow other related articles on the PHP Chinese website!
Laravel's Impact: Simplifying Web DevelopmentApr 21, 2025 am 12:18 AMLaravel stands out by simplifying the web development process and delivering powerful features. Its advantages include: 1) concise syntax and powerful ORM system, 2) efficient routing and authentication system, 3) rich third-party library support, allowing developers to focus on writing elegant code and improve development efficiency.
Laravel: Frontend or Backend? Clarifying the Framework's RoleApr 21, 2025 am 12:17 AMLaravelispredominantlyabackendframework,designedforserver-sidelogic,databasemanagement,andAPIdevelopment,thoughitalsosupportsfrontenddevelopmentwithBladetemplates.
Laravel vs. Python: Exploring Performance and ScalabilityApr 21, 2025 am 12:16 AMLaravel and Python have their own advantages and disadvantages in terms of performance and scalability. Laravel improves performance through asynchronous processing and queueing systems, but due to PHP limitations, there may be bottlenecks when high concurrency is present; Python performs well with the asynchronous framework and a powerful library ecosystem, but is affected by GIL in a multi-threaded environment.
Laravel vs. Python (with Frameworks): A Comparative AnalysisApr 21, 2025 am 12:15 AMLaravel is suitable for projects that teams are familiar with PHP and require rich features, while Python frameworks depend on project requirements. 1.Laravel provides elegant syntax and rich features, suitable for projects that require rapid development and flexibility. 2. Django is suitable for complex applications because of its "battery inclusion" concept. 3.Flask is suitable for fast prototypes and small projects, providing great flexibility.
Frontend with Laravel: Exploring the PossibilitiesApr 20, 2025 am 12:19 AMLaravel can be used for front-end development. 1) Use the Blade template engine to generate HTML. 2) Integrate Vite to manage front-end resources. 3) Build SPA, PWA or static website. 4) Combine routing, middleware and EloquentORM to create a complete web application.
PHP and Laravel: Building Server-Side ApplicationsApr 20, 2025 am 12:17 AMPHP and Laravel can be used to build efficient server-side applications. 1.PHP is an open source scripting language suitable for web development. 2.Laravel provides routing, controller, EloquentORM, Blade template engine and other functions to simplify development. 3. Improve application performance and security through caching, code optimization and security measures. 4. Test and deployment strategies to ensure stable operation of applications.
Laravel vs. Python: The Learning Curves and Ease of UseApr 20, 2025 am 12:17 AMLaravel and Python have their own advantages and disadvantages in terms of learning curve and ease of use. Laravel is suitable for rapid development of web applications. The learning curve is relatively flat, but it takes time to master advanced functions. Python's grammar is concise and the learning curve is flat, but dynamic type systems need to be cautious.
Laravel's Strengths: Backend DevelopmentApr 20, 2025 am 12:16 AMLaravel's advantages in back-end development include: 1) elegant syntax and EloquentORM simplify the development process; 2) rich ecosystem and active community support; 3) improved development efficiency and code quality. Laravel's design allows developers to develop more efficiently and improve code quality through its powerful features and tools.
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
SublimeText3 Chinese version
Chinese version, very easy to use
mPDF
mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),
Safe Exam Browser
Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.
PhpStorm Mac version
The latest (2018.2.1) professional PHP integrated development tool
Notepad++7.3.1
Easy-to-use and free code editor
