Laravel Sanctum SPA API Authentication Example

By Hardik Savani April 16, 2024 Category : Laravel

Hello,

Here, i will show you laravel sanctum spa authentication. This article will give you simple example of laravel sanctum api authentication. you can understand a concept of laravel sanctum api auth. i would like to share with you laravel sanctum api tutorial. Here, Creating a basic example of laravel sanctum mobile authentication.

you can easily create api using sanctum in laravel 6, laravel 7, laravel 8, laravel 9, laravel 10 and laravel 11 version.

Laravel Sanctum provides a simple authentication system for SPAs (single page applications), mobile applications, and simple, token based APIs. Sanctum also allows each user of your application to generate multiple API tokens for their account.

So you also want to create api for your mobile application than you can follow this tutorial for how to create rest api step by step with laravel and sanctum. If you are new than don't worry about that i written tutorial step by step.

Follow bellow few steps to create restful api example in laravel 8 app.

Step 1: Install Laravel

I am going to explain step by step from scratch so, we need to get fresh Laravel application using bellow command, So open your terminal OR command prompt and run bellow command:

composer create-project --prefer-dist laravel/laravel blog

Step 2: Use Sanctum

In this step we need to install sanctum via the Composer package manager, so one your terminal and fire bellow command:

composer require laravel/sanctum

After successfully install package, we need to publish configuration file with following command:

php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"

we require to get default migration for create new sanctum tables in our database. so let's run bellow command.

php artisan migrate

Next, we need to add middleware for sanctum api, so let's add as like bellow:

app/Http/Kernel.php

....

'api' => [

\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,

'throttle:api',

\Illuminate\Routing\Middleware\SubstituteBindings::class,

],

....

Step 3: Sanctum Configuration

In this step, we have to configuration on three place model, service provider and auth config file. So you have to just following change on that file.

In model we added HasApiTokens class of Sanctum,

In auth.php, we added api auth configuration.

app/Models/User.php

<?php

namespace App\Models;

use Illuminate\Contracts\Auth\MustVerifyEmail;

use Illuminate\Database\Eloquent\Factories\HasFactory;

use Illuminate\Foundation\Auth\User as Authenticatable;

use Illuminate\Notifications\Notifiable;

use Laravel\Sanctum\HasApiTokens;

class User extends Authenticatable

{

use HasFactory, Notifiable, HasApiTokens;

/**

* The attributes that are mass assignable.

*

* @var array

*/

protected $fillable = [

'name',

'email',

'password',

];

/**

* The attributes that should be hidden for arrays.

*

* @var array

*/

protected $hidden = [

'password',

'remember_token',

];

/**

* The attributes that should be cast to native types.

*

* @var array

*/

protected $casts = [

'email_verified_at' => 'datetime',

];

}

Step 4: Add Product Table and Model

next, we require to create migration for posts table using Laravel 8 php artisan command, so first fire bellow command:

php artisan make:migration create_products_table

After this command you will find one file in following path database/migrations and you have to put bellow code in your migration file for create products table.

<?php


use Illuminate\Support\Facades\Schema;

use Illuminate\Database\Schema\Blueprint;

use Illuminate\Database\Migrations\Migration;


class CreateProductsTable extends Migration

{

/**

* Run the migrations.

*

* @return void

*/

public function up()

{

Schema::create('products', function (Blueprint $table) {

$table->id();

$table->string('name');

$table->text('detail');

$table->timestamps();

});

}


/**

* Reverse the migrations.

*

* @return void

*/

public function down()

{

Schema::dropIfExists('products');

}

}

After create migration we need to run above migration by following command:

php artisan migrate

After create "products" table you should create Product model for products, so first create file in this path app/Models/Product.php and put bellow content in item.php file:

app/Models/Product.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;

use Illuminate\Database\Eloquent\Model;

class Product extends Model

{

use HasFactory;

/**

* The attributes that are mass assignable.

*

* @var array

*/

protected $fillable = [

'name', 'detail'

];

}

Step 5: Create API Routes

In this step, we will create api routes. Laravel provide api.php file for write web services route. So, let's add new route on that file.

routes/api.php

<?php

use Illuminate\Http\Request;

use Illuminate\Support\Facades\Route;

use App\Http\Controllers\API\RegisterController;

use App\Http\Controllers\API\ProductController;

/*

|--------------------------------------------------------------------------

| API Routes

|--------------------------------------------------------------------------

|

| Here is where you can register API routes for your application. These

| routes are loaded by the RouteServiceProvider within a group which

| is assigned the "api" middleware group. Enjoy building your API!

|

*/

Route::post('register', [RegisterController::class, 'register']);

Route::post('login', [RegisterController::class, 'login']);

Route::middleware('auth:sanctum')->group( function () {

Route::resource('products', ProductController::class);

});

Step 6: Create Controller Files

in next step, now we have create new controller as BaseController, ProductController and RegisterController, i created new folder "API" in Controllers folder because we will make alone APIs controller, So let's create both controller:

app/Http/Controllers/API/BaseController.php

<?php


namespace App\Http\Controllers\API;


use Illuminate\Http\Request;

use App\Http\Controllers\Controller as Controller;


class BaseController extends Controller

{

/**

* success response method.

*

* @return \Illuminate\Http\Response

*/

public function sendResponse($result, $message)

{

$response = [

'success' => true,

'data' => $result,

'message' => $message,

];


return response()->json($response, 200);

}


/**

* return error response.

*

* @return \Illuminate\Http\Response

*/

public function sendError($error, $errorMessages = [], $code = 404)

{

$response = [

'success' => false,

'message' => $error,

];


if(!empty($errorMessages)){

$response['data'] = $errorMessages;

}


return response()->json($response, $code);

}

}

app/Http/Controllers/API/RegisterController.php

<?php

namespace App\Http\Controllers\API;

use Illuminate\Http\Request;

use App\Http\Controllers\API\BaseController as BaseController;

use App\Models\User;

use Illuminate\Support\Facades\Auth;

use Validator;

class RegisterController extends BaseController

{

/**

* Register api

*

* @return \Illuminate\Http\Response

*/

public function register(Request $request)

{

$validator = Validator::make($request->all(), [

'name' => 'required',

'email' => 'required|email',

'password' => 'required',

'c_password' => 'required|same:password',

]);

if($validator->fails()){

return $this->sendError('Validation Error.', $validator->errors());

}

$input = $request->all();

$input['password'] = bcrypt($input['password']);

$user = User::create($input);

$success['token'] = $user->createToken('MyApp')->plainTextToken;

$success['name'] = $user->name;

return $this->sendResponse($success, 'User register successfully.');

}

/**

* Login api

*

* @return \Illuminate\Http\Response

*/

public function login(Request $request)

{

if(Auth::attempt(['email' => $request->email, 'password' => $request->password])){

$user = Auth::user();

$success['token'] = $user->createToken('MyApp')->plainTextToken;

$success['name'] = $user->name;

return $this->sendResponse($success, 'User login successfully.');

}

else{

return $this->sendError('Unauthorised.', ['error'=>'Unauthorised']);

}

}

}

app/Http/Controllers/API/ProductController.php

<?php

namespace App\Http\Controllers\API;

use Illuminate\Http\Request;

use App\Http\Controllers\API\BaseController as BaseController;

use App\Models\Product;

use Validator;

use App\Http\Resources\Product as ProductResource;

class ProductController extends BaseController

{

/**

* Display a listing of the resource.

*

* @return \Illuminate\Http\Response

*/

public function index()

{

$products = Product::all();

return $this->sendResponse(ProductResource::collection($products), 'Products retrieved successfully.');

}

/**

* Store a newly created resource in storage.

*

* @param \Illuminate\Http\Request $request

* @return \Illuminate\Http\Response

*/

public function store(Request $request)

{

$input = $request->all();

$validator = Validator::make($input, [

'name' => 'required',

'detail' => 'required'

]);

if($validator->fails()){

return $this->sendError('Validation Error.', $validator->errors());

}

$product = Product::create($input);

return $this->sendResponse(new ProductResource($product), 'Product created successfully.');

}

/**

* Display the specified resource.

*

* @param int $id

* @return \Illuminate\Http\Response

*/

public function show($id)

{

$product = Product::find($id);

if (is_null($product)) {

return $this->sendError('Product not found.');

}

return $this->sendResponse(new ProductResource($product), 'Product retrieved successfully.');

}

/**

* Update the specified resource in storage.

*

* @param \Illuminate\Http\Request $request

* @param int $id

* @return \Illuminate\Http\Response

*/

public function update(Request $request, Product $product)

{

$input = $request->all();

$validator = Validator::make($input, [

'name' => 'required',

'detail' => 'required'

]);

if($validator->fails()){

return $this->sendError('Validation Error.', $validator->errors());

}

$product->name = $input['name'];

$product->detail = $input['detail'];

$product->save();

return $this->sendResponse(new ProductResource($product), 'Product updated successfully.');

}

/**

* Remove the specified resource from storage.

*

* @param int $id

* @return \Illuminate\Http\Response

*/

public function destroy(Product $product)

{

$product->delete();

return $this->sendResponse([], 'Product deleted successfully.');

}

}

Step 7: Create Eloquent API Resources

This is a very important step of creating rest api in laravel 8. you can use eloquent api resources with api. it will helps you to make same response layout of your model object. we used in ProductController file. now we have to create it using following command:

php artisan make:resource Product

Now there created new file with new folder on following path:

app/Http/Resources/Product.php

<?php

namespace App\Http\Resources;

use Illuminate\Http\Resources\Json\JsonResource;

class Product extends JsonResource

{

/**

* Transform the resource into an array.

*

* @param \Illuminate\Http\Request $request

* @return array

*/

public function toArray($request)

{

return [

'id' => $this->id,

'name' => $this->name,

'detail' => $this->detail,

'created_at' => $this->created_at->format('d/m/Y'),

'updated_at' => $this->updated_at->format('d/m/Y'),

];

}

}

Now we are ready to to run full restful api and also passport api in laravel. so let's run our example so run bellow command for quick run:

php artisan serve

make sure in details api we will use following headers as listed bellow:

'headers' => [

'Accept' => 'application/json',

'Authorization' => 'Bearer '.$accessToken,

]

Here is Routes URL with Verb:

Now simply you can run above listed url like as bellow screen shot:

1) Register API: Verb:GET, URL:http://localhost:8000/api/register

2) Login API: Verb:GET, URL:http://localhost:8000/api/login

3) Product List API: Verb:GET, URL:http://localhost:8000/api/products

4) Product Create API: Verb:POST, URL:http://localhost:8000/api/products

5) Product Show API: Verb:GET, URL:http://localhost:8000/api/products/{id}

6) Product Update API: Verb:PUT, URL:http://localhost:8000/api/products/{id}

7) Product Delete API: Verb:DELETE, URL:http://localhost:8000/api/products/{id}

You can download code from git: Download Code from Github

I hope it can help you...

Tags :
Shares