Dev to webs {Coding…}

เรียนรู้การพัฒนาซอฟเวอร์ เพื่อความรู้ที่ยั่งยืน

บทที่ 15: การใช้ Middleware ใน Component – การใช้ Middleware เพื่อควบคุมการเข้าถึง

รายละเอียด

Middleware เป็นกลไกใน Laravel ที่ช่วยจัดการ การตรวจสอบ และ การกรองการเข้าถึง ก่อนที่ผู้ใช้จะเข้าถึงส่วนต่าง ๆ ของแอปพลิเคชัน Livewire Component ก็สามารถใช้ Middleware เพื่อควบคุมการเข้าถึงได้ เช่น การตรวจสอบการล็อกอิน การตรวจสอบสิทธิ์ หรือการกรองข้อมูล Middleware สามารถเพิ่มความปลอดภัยและปรับปรุงประสบการณ์การใช้งานโดยการป้องกันการเข้าถึงที่ไม่ได้รับอนุญาต


การใช้ Middleware ใน Livewire Component

การกำหนด Middleware ให้ Component ใน Livewire คุณสามารถใช้ Middleware กับ Component โดยกำหนดในฟังก์ชัน boot หรือใช้ใน Controller ที่เรียก Component

ตัวอย่าง Component:

php artisan make:livewire SecuredComponent

ในไฟล์ SecuredComponent.php:

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class SecuredComponent extends Component
{
    public function mount()
    {
        // Middleware สำหรับตรวจสอบการล็อกอิน
        if (!auth()->check()) {
            abort(403, 'Unauthorized');
        }
    }

    public function render()
    {
        return view('livewire.secured-component');
    }
}

การใช้ Middleware ผ่าน Route คุณสามารถกำหนด Middleware ให้ Component ผ่าน Route ได้ โดยใช้ Route::group หรือกำหนด Middleware สำหรับ Route ที่เรียกใช้ Component

ตัวอย่าง:

use App\Http\Livewire\SecuredComponent;

Route::middleware(['auth'])->group(function () {
    Route::get('/secured', SecuredComponent::class)->name('secured');
});

การสร้าง Middleware สำหรับ Component หากต้องการสร้าง Middleware แบบกำหนดเอง ให้ใช้คำสั่ง:

php artisan make:middleware CheckUserRole

ในไฟล์ CheckUserRole.php:

<?php

namespace App\Http\Middleware;

use Closure;
use Illuminate\Http\Request;

class CheckUserRole
{
    public function handle(Request $request, Closure $next, $role)
    {
        if (!auth()->check() || auth()->user()->role !== $role) {
            abort(403, 'Unauthorized');
        }

        return $next($request);
    }
}

เพิ่ม Middleware ใน Kernel.php:

protected $routeMiddleware = [
    'check.role' => \App\Http\Middleware\CheckUserRole::class,
];

ใช้ Middleware ใน Route ที่เรียก Component:

Route::get('/admin', \App\Http\Livewire\AdminDashboard::class)
    ->middleware('check.role:admin')
    ->name('admin.dashboard');

การแสดง View เมื่อการเข้าถึงถูกปฏิเสธ เมื่อผู้ใช้ถูกปฏิเสธการเข้าถึง (เช่น abort(403) หรือ Middleware ปฏิเสธ) Laravel จะเรียก View ที่กำหนดไว้ใน errors/403.blade.php:

<h1>Access Denied</h1>
<p>You do not have permission to access this page.</p>


    ตัวอย่างการใช้งาน Middleware ใน Component

    สร้าง Component สำหรับหน้า Admin Dashboard

    สร้าง Component:

    php artisan make:livewire AdminDashboard
    
    

    ใน AdminDashboard.php:

    <?php
    
    namespace App\Http\Livewire;
    
    use Livewire\Component;
    
    class AdminDashboard extends Component
    {
        public function mount()
        {
            if (!auth()->user() || auth()->user()->role !== 'admin') {
                abort(403, 'Unauthorized');
            }
        }
    
        public function render()
        {
            return view('livewire.admin-dashboard');
        }
    }
    
    

    ใน View (admin-dashboard.blade.php):

    <div>
        <h1>Welcome to Admin Dashboard</h1>
    </div>
    
    

    กำหนด Route:

    Route::get('/admin', \App\Http\Livewire\AdminDashboard::class)
        ->middleware('auth')
        ->name('admin.dashboard');
    
    

      การนำไปใช้งาน

      Middleware เหมาะสำหรับ:

      • การควบคุมการเข้าถึงส่วนต่าง ๆ ของแอป เช่น หน้า Admin, หน้า Dashboard
      • การตรวจสอบสิทธิ์ของผู้ใช้ เช่น Role-based Access Control (RBAC)
      • การกำหนดเงื่อนไขเฉพาะ เช่น การตรวจสอบสถานะบัญชี

      ประโยชน์ของการใช้ Middleware ใน Livewire Component

      • เพิ่มความปลอดภัยและป้องกันการเข้าถึงที่ไม่ได้รับอนุญาต
      • ช่วยลดโค้ดซ้ำซ้อนในการตรวจสอบสิทธิ์
      • สามารถกำหนดการเข้าถึงได้อย่างยืดหยุ่นและง่ายต่อการจัดการ