Web POS (Point of Sale) adalah aplikasi berbasis web yang digunakan untuk mengelola transaksi penjualan di toko, kafe, restoran, atau bisnis retail lainnya. Sistem ini membantu kasir dalam mencatat penjualan, mengelola stok barang, mencetak struk, hingga membuat laporan penjualan secara otomatis. Karena berbasis web, POS dapat diakses dari browser tanpa instalasi, dapat digunakan di berbagai perangkat seperti laptop, tablet, atau komputer kasir.
1. Persiapan Awal
Pastikan sudah terinstal:
- PHP ≥ 8.1
- Composer
- MySQL
- Laravel (bisa buat via composer)
Buat project baru:
composer create-project laravel/laravel pos-api cd pos-api
Konfigurasi database di file .env:
DB_CONNECTION=mysql DB_DATABASE=posdb DB_USERNAME=root DB_PASSWORD=
Kemudian migrasikan tabel default:
php artisan migrate
2. Install Laravel Sanctum
Sanctum adalah paket API Token (untuk login).
composer require laravel/sanctum php artisan vendor:publish --tag=sanctum-migrations php artisan migrate
Cara Menambah Middleware di Laravel 12 (TIDAK ADA Kernel.php)
Sebagai gantinya, middleware diatur di:
✔ bootstrap/app.php
Laravel 12 memakai definisi middleware seperti ini:
📌 Tambahkan middleware Sanctum ke API group
Edit:
bootstrap/app.php
Tambahkan di bagian:
->withMiddleware(function (Middleware $middleware) {
$middleware->group('api', [
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
\Illuminate\Routing\Middleware\ThrottleRequests::class.':api',
\Illuminate\Routing\Middleware\SubstituteBindings::class,
]);
})
Penjelasan
- EnsureFrontendRequestsAreStateful → memungkinkan SPA seperti Vue.js menggunakan Sanctum token.
- ThrottleRequests:api → membatasi request API.
- SubstituteBindings → mendukung route model binding otomatis.
Tidak perlu membuat Kernel.php, karena Laravel 12 sudah memindahkan registrasi middleware ke bootstrap/app.php.
3. Buat Auth API (Register + Login)
php artisan make:controller AuthController
Isi lengkap app/Http/Controllers/AuthController.php:
<?php
namespace App\Http\Controllers;
use App\Models\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
class AuthController extends Controller
{
public function register(Request $request)
{
$request->validate([
'name' => 'required',
'email' => 'required|unique:users',
'password' => 'required|min:6'
]);
$user = User::create([
'name' => $request->name,
'email' => $request->email,
'password' => Hash::make($request->password)
]);
return response()->json(['message' => 'Register success', 'user' => $user]);
}
public function login(Request $request)
{
$user = User::where('email', $request->email)->first();
if (!$user || !Hash::check($request->password, $user->password)) {
return response()->json(['message' => 'Email atau password salah'], 401);
}
$token = $user->createToken("pos-token")->plainTextToken;
return response()->json([
"user" => $user,
"token" => $token
]);
}
}
4. Tambahkan Routes
Edit file routes/web.php:
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\AuthController;
use App\Http\Controllers\CategoryController;
use App\Http\Controllers\ProductController;
Route::prefix('api')->group(function () {
Route::post('/register', [AuthController::class, 'register']);
Route::post('/login', [AuthController::class, 'login']);
});
Route::middleware('auth:sanctum')->group(function () {
Route::apiResource('/categories', CategoryController::class);
Route::apiResource('/products', ProductController::class);
});
5. Install Postman untuk cek API
Anda bisa menggunakan postman versi web atau desktop dengan download disini : https://www.postman.com/downloads/
Setelah download, install dan buka postman, lalu buat collection misalnya “POS-API” -> sub folder “Auth”.
5.1 Buka Endpoint CSRF Token
Laravel Sanctum menyediakan endpoint:
/sanctum/csrf-cookie
GET via Postman
URL:
http://localhost:8000/sanctum/csrf-cookie
📌 Pastikan set:
- Method: GET
- Headers:
Accept: application/json
Jika berhasil:
- Response: 204 No Content
- Cookie baru muncul di Postman:
XSRF-TOKENlaravel_session
Lihat di tab Cookies → domain localhost.
5.2 Kirim CSRF token ke Laravel
Setelah step 1, Postman sekarang menyimpan cookie:
- XSRF-TOKEN (encoded URL version)
- laravel_session
Untuk permintaan POST, Anda harus menambahkan header:
Tambahkan header berikut di Postman:
X-XSRF-TOKEN: {token hasil decode XSRF-TOKEN}
Cara mendapatkan token:
- Klik Cookies
- Pilih domain
localhost - Pilih XSRF-TOKEN
- Copy value → decode URL-nya
contoh token seperti:eyJpdiI6Ik1qQXlnPT0iLCJ2YWx1ZSI6Im5FV0JQOWNXa0FvUndJTkVhY0JSbnc9PSIsIm1hYyI6IjY0MTkyY2NmYWI2YmRkOTc2NWM5NmMxMTE2ZDJhNzQzOTZkZDUxMzlhN2M0NWUzMzhkNmM1YjljNjA0MjY1MGIifQ%3D%3D - Paste ke header X-XSRF-TOKEN.
5.3 Mengirim Request POST /register dengan CSRF
Setup:
- Method: POST
- URL:
http://localhost:8000/api/register - Headers:
Accept: application/json
X-XSRF-TOKEN: [token hasil decode] - Body (JSON):
{
"name": "Engkus Kusnadi",
"email": "engkuskusnadifuture@gmail.com",
"password": "admin1234"
}
Jika semua benar → Response berhasil tanpa 419.
Sekarang cek di localhost/phpmyadmin dan cek di database posdb -> klik tabel “users” harusnya muncul datanya seperti berikut.
