Tutorial Laravel 11: Cara Integrasi Payment Midtrans! Simak Yuk!

16 Agustus 2025

Tutorial Laravel 11: Cara Integrasi Payment Midtrans! Simak Yuk!

Pada era digital ini, transaksi online harus mudah dan aman. Tutorial Laravel 11 integrasi Payment Midtrans ini memberikan panduan lengkap langkah demi langkah untuk menerapkan payment gateway Midtrans ke proyek Laravel 11 Anda. Fitur payment gateway memudahkan pengguna memilih metode pembayaran (transfer bank, e-wallet, kartu kredit) dan mempercepat proses checkout. Dengan integrasi Midtrans, proses pembayaran menjadi lebih cepat, aman, dan efisien sehingga meningkatkan kepuasan pengguna. Selamat membaca dan tingkatkan kualitas situs e-commerce Anda dengan sistem pembayaran modern!

Mengapa Memilih Laravel 11 dan Midtrans?

Laravel adalah framework PHP populer dengan fitur lengkap dan dukungan komunitas luas. Midtrans dikenal sebagai payment gateway handal di Indonesia, mendukung metode pembayaran seperti kartu kredit, transfer bank, e-wallet, hingga OVO dan GoPay. Integrasi Laravel dan Midtrans menjadi kombinasi ideal untuk menangani transaksi online dengan aman dan mudah. Seperti dijelaskan Codepolitan, “di era digital yang serba cepat ini, memiliki sistem pembayaran yang andal sangat penting”. Tutorial Laravel ini membantu Anda memanfaatkan Laravel 11 terbaru yang lebih modern dan efisien untuk mengimplementasikan Midtrans secara terstruktur.

Persiapan Proyek dan Akun Midtrans

Sebelum mulai integrasi, siapkan beberapa hal penting:

Akun Midtrans: Daftarkan akun Midtrans dan ambil Server Key dan Client Key dari Dashboard Midtrans. Kunci ini dibutuhkan untuk konfigurasi komunikasi dengan Midtrans.
Proyek Laravel 11: Buat atau pastikan proyek Laravel 11 Anda sudah berjalan lancar. Laravel 11 memudahkan setup payment gateway berkat arsitektur dan sistem middleware yang diperbarui.
Composer: Pastikan Composer terpasang untuk menginstal paket tambahan.
Pemahaman Alur: Ketahui alur integrasi Midtrans, seperti pembuatan transaksi, pembuatan token pembayaran, dan penanganan notifikasi pembayaran.

Dengan melakukan persiapan di atas, Anda siap mengikuti langkah-langkah integrasi Midtrans secara bertahap. Seluruh proses ini akan meningkatkan profesionalisme aplikasi e-commerce Anda dan memberikan kenyamanan ekstra bagi pengguna dalam bertransaksi.

Menyiapkan Tabel Database (Migration dan Model)

Untuk keperluan toko online, kita perlu beberapa tabel utama: products, customers, dan transactions. Gunakan Laravel Artisan untuk membuat migration dan model secara cepat:

Tabel Produk: Jalankan php artisan make:model Product -m. Edit migration create_products_table dengan kolom id, name, description, price, stock, serta timestamp. Contohnya, name bertipe string, description teks (nullable), price desimal, stock integer. Jangan lupa tambahkan $fillable di model Product untuk kolom tersebut.
Tabel Customer: Gunakan php artisan make:model Customer -m. Di migration create_customers_table, buat kolom id, name, email (unique), phone_number, address, dan timestamp. Di model Customer, atur $fillable pada atribut ini.
Tabel Transaksi: Jalankan php artisan make:model Transaction -m. Pada migration create_transactions_table, buat kolom id, product_id (foreign key ke products), customer_id (FK ke customers), quantity, total_price, status (default 'pending'), dan timestamp. Di model Transaction, set $fillable serta definisikan relasi belongsTo ke Product dan Customer seperti contoh pada tutorial.

Setelah semua migration siap, jalankan php artisan migrate untuk membuat tabel di database. Relasi antar tabel sudah diatur: satu transaksi terkait satu produk dan satu customer. Desain ini memudahkan pencatatan pesanan dan update status pembayarannya dalam sistem.

Alur Checkout dengan Service-Repository Pattern (Analogi Restoran)

Agar kode terstruktur, kita menggunakan Service-Repository Pattern untuk logika checkout. Berikut analoginya dengan proses di restoran:

Blade sebagai Menu Restoran: Blade di Laravel menampilkan daftar produk layaknya menu restoran. Pengguna memilih produk (seperti memilih hidangan) lalu menuju ke kasir.
Controller sebagai Kasir: Controller menerima pesanan dari pelanggan, mirip kasir yang mengatur pesanan. Data pesanan (produk, jumlah, harga, data pelanggan) diterima Controller untuk diproses.
Service (Logika Bisnis) sebagai Dapur: Service layer bertindak sebagai dapur, menghitung total dan menyiapkan transaksi. Di sini juga dibentuk request ke Midtrans untuk mendapatkan Snap Token pembayaran.
Midtrans sebagai Mesin Pembayaran: Setelah pesanan siap, Controller/Service mengirim data transaksi ke Midtrans. Midtrans mengembalikan Snap Token yang digunakan untuk membuka halaman pembayaran (mirip kasir menggunakan mesin EDC). Pelanggan membayar melalui halaman Midtrans (Snap.js).
Webhook sebagai Konfirmasi Bayar ke Kasir: Setelah pembayaran selesai, Midtrans mengirim notifikasi (webhook) ke aplikasi kita. Controller menangani notifikasi ini (layaknya kasir menerima konfirmasi bayaran) dan Repository akan memperbarui status transaksi di database.
Konfirmasi kepada Pelanggan: Setelah status transaksi diperbarui (misalnya menjadi 'paid'), pelanggan mendapatkan notifikasi sukses. Situs web dapat menampilkan konfirmasi pembayaran yang mirip struk di restoran.

Secara ringkas, Blade = menu restoran (tampilan UI)；Controller = kasir (menangani pesanan)；Service = dapur (logika pemesanan & komunikasi Midtrans)；Repository = buku kasir (menyimpan data transaksi)；Midtrans = mesin pembayaran (mengurus transaksi keuangan). Dengan pola ini, alur checkout menjadi terstruktur dan mudah dipahami.

Instalasi dan Konfigurasi Midtrans

Mulai integrasi Midtrans dengan menambahkan SDK Midtrans ke proyek Laravel:

Pasang Midtrans SDK: Jalankan composer require midtrans/midtrans-php. Perintah ini menginstal library Midtrans untuk memudahkan interaksi ke Midtrans API.
Set Kunci API di .env: Tambahkan baris berikut ke file .env Laravel Anda:
```
MIDTRANS_SERVER_KEY=your-server-key-here  
MIDTRANS_CLIENT_KEY=your-client-key-here  
MIDTRANS_IS_PRODUCTION=false
```
Gantilah your-server-key-here dan your-client-key-here dengan kunci dari Dashboard Midtrans. Pastikan MIDTRANS_IS_PRODUCTION sesuai lingkungan (sandbox/production).

File Konfigurasi Midtrans: Buat file baru config/midtrans.php dengan konten:

<?php
return [
    'server_key' => env('MIDTRANS_SERVER_KEY'),
    'client_key' => env('MIDTRANS_CLIENT_KEY'),
    'is_production' => env('MIDTRANS_IS_PRODUCTION', false),
    'is_sanitized' => true,
    'is_3ds' => true,
];

Konfigurasi ini menghubungkan kunci API dari .env ke pengaturan Midtrans di Laravel.

Middleware (Laravel 11): Laravel 11 mengubah cara menyertakan middleware global. Tambahkan middleware MidtransConfig pada bootstrap/app.php seperti:
```
$middleware->append(\App\Http\Middleware\MidtransConfig::class);
```
Dengan ini, setiap permintaan ke aplikasi akan menggunakan konfigurasi Midtrans dari config/midtrans.php.

Setelah langkah di atas, aplikasi siap berkomunikasi dengan Midtrans. Konfigurasi yang tepat memastikan komunikasi aman dan sesuai kebutuhan aplikasi.

Service dan Repository untuk Checkout

Untuk memisahkan logika bisnis dan akses data, kita gunakan Repository Pattern. Berikut garis besarnya:

Buat interface TransactionRepositoryInterface dengan metode createTransaction($data).
Implementasikan interface tersebut di TransactionRepository menggunakan model Transaction.
Buat service CheckoutService yang meng-inject TransactionRepositoryInterface. Di sini kita simpan transaksi ke database dan berkomunikasi dengan Midtrans.
Di constructor CheckoutService, konfigurasikan Midtrans (serverKey, isProduction, dll) dari config/midtrans.php.
Metode processCheckout($data) di CheckoutService melakukan:
1. Simpan data transaksi ke tabel transactions menggunakan repository.
2. Bentuk parameter transaksi dan customer_details untuk Midtrans Snap.
3. Panggil \Midtrans\Snap::getSnapToken($params) untuk mendapatkan Snap Token.
4. Kembalikan transaksi dan token tersebut ke Controller.

Menggunakan pattern ini, CheckoutService berperan seperti dapur yang menangani seluruh logika checkout, sedangkan TransactionRepository adalah buku kasir yang menyimpan data transaksi. Dependency Injection di Laravel menjaga kode tetap terstruktur dan mudah diuji.

Membuat Controller dan Routes

Berikut langkah membuat controller dan route untuk checkout:

Controller Pembayaran: Buat controller dengan php artisan make:controller PaymentController.

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Services\CheckoutService;

class PaymentController extends Controller
{
    protected $checkoutService;
    public function __construct(CheckoutService $checkoutService)
    {
        $this->checkoutService = $checkoutService;
    }
    public function checkout(Request $request)
    {
        $data = [
            'product_id' => $request->input('product_id'),
            'customer_id' => $request->input('customer_id'),
            'quantity' => $request->input('quantity'),
            'total_price' => $request->input('total_price'),
            'customer_name' => $request->input('name'),
            'customer_email' => $request->input('email'),
            'customer_phone' => $request->input('phone_number'),
        ];
        $result = $this->checkoutService->processCheckout($data);
        return response()->json([
            'snap_token' => $result['snap_token'],
            'transaction' => $result['transaction']
        ]);
    }
}

Binding Repository: Daftarkan binding di App\Providers\AppServiceProvider:

use App\Repositories\TransactionRepositoryInterface;
use App\Repositories\TransactionRepository;

public function register()
{
    $this->app->bind(TransactionRepositoryInterface::class, TransactionRepository::class);
}

Route Checkout: Tambahkan route untuk checkout di routes/web.php:

use App\Http\Controllers\PaymentController;
Route::post('/checkout', [PaymentController::class, 'checkout']);

Dengan setup di atas, Controller akan memanggil CheckoutService untuk mengolah transaksi. Jika request berhasil, API akan mengembalikan Snap Token dari Midtrans dan data transaksi dalam format JSON.

Contoh tampilan halaman pembayaran Midtrans Snap menampilkan pilihan metode pembayaran (kartu kredit, virtual account, e-wallet, dll). Setelah mendapatkan Snap Token, frontend bisa menampilkan halaman pembayaran Midtrans. Misalnya, buat view Blade dengan tombol Pay! dan panggil snap.pay(snap_token) seperti berikut:

<button id="pay-button">Bayar dengan Midtrans</button>
<script src="https://app.sandbox.midtrans.com/snap/snap.js"
        data-client-key="{{ config('midtrans.client_key') }}"></script>
<script>
document.getElementById('pay-button').onclick = function () {
    fetch('/checkout', {
        method: 'POST',
        headers: {'Content-Type': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
        body: JSON.stringify({
            product_id: 1, customer_id: 1, quantity: 2,
            total_price: 200000, name: 'John Doe',
            email: 'john@example.com', phone_number: '08123456789'
        })
    })
    .then(res => res.json())
    .then(data => {
        snap.pay(data.snap_token);
    });
};
</script>

Dengan kode di atas, ketika tombol diklik, aplikasi akan meminta Snap Token melalui endpoint /checkout dan memicu widget pembayaran Midtrans (Snap.js) di browser. Pengguna dapat memilih metode pembayaran dan menyelesaikan transaksi dengan cepat.

Menangani Webhook Midtrans

Setelah transaksi dibuat, perlu memantau status pembayarannya. Midtrans mengirim notifikasi webhook ke server saat status berubah (misal settlement, cancel, expire). Berikut cara mengelola webhook di Laravel:

Route Webhook: Tambahkan route khusus di routes/web.php:

Route::post('/midtrans/webhook', [PaymentController::class, 'handleWebhook']);

Metode handleWebhook: Di PaymentController, tambahkan fungsi untuk memproses notifikasi:

public function handleWebhook(Request $request)
{
    $serverKey = config('midtrans.server_key');
    $signatureKey = hash("sha512",
        $request->order_id .
        $request->status_code .
        $request->gross_amount .
        $serverKey
    );
    if ($signatureKey !== $request->signature_key) {
        return response()->json(['message' => 'Invalid signature key'], 403);
    }
    $transaction = \App\Models\Transaction::find($request->order_id);
    if (!$transaction) {
        return response()->json(['message' => 'Transaction not found'], 404);
    }
    // Update status berdasarkan notifikasi
    if (in_array($request->transaction_status, ['settlement','capture'])) {
        $transaction->status = 'paid';
    } elseif (in_array($request->transaction_status, ['cancel','expire'])) {
        $transaction->status = 'failed';
    } elseif ($request->transaction_status == 'pending') {
        $transaction->status = 'pending';
    }
    $transaction->save();
    return response()->json(['message' => 'Webhook processed successfully']);
}

Kode di atas memverifikasi signature key untuk keamanan, mencari transaksi di database, dan memperbarui status menjadi paid, failed, atau pending sesuai notifikasi Midtrans. Pastikan endpoint webhook dapat diakses publik; Midtrans tidak bisa mengirim ke localhost atau URL yang dilindungi. Untuk pengujian lokal, gunakan layanan tunneling seperti ngrok.

Set Webhook di Dashboard Midtrans: Di Dashboard Midtrans, masuk ke menu Settings > Configuration, lalu atur Payment Notification URL ke endpoint webhook Anda (mis. https://your-domain.com/midtrans/webhook). Dengan ini, setiap perubahan status transaksi akan otomatis dilaporkan ke aplikasi Anda.

Dengan webhook, status transaksi di aplikasi Anda selalu terbarui saat pelanggan menyelesaikan pembayaran. Pastikan server merespon HTTP 200 saat menerima notifikasi untuk mengonfirmasi penerimaan.

5 Kesalahan Umum Pengembang Pemula

Integrasi Midtrans perlu kehati-hatian. Berikut 5 kesalahan yang sering terjadi:

Tidak Memvalidasi Signature Key: Mengabaikan verifikasi signature dapat membuka celah manipulasi data. Selalu periksa signature key dari order_id, status_code, gross_amount, dan serverKey sebelum memproses webhook.
Mengabaikan Semua Status Transaksi: Hanya menangani status sukses (paid) saja. Pastikan Anda juga menangani status pending, cancel, expire agar aplikasi tidak salah klasifikasi transaksi.
Tidak Mengecek Keberadaan Transaksi: Jangan langsung update tanpa memeriksa apakah order_id valid. Selalu lakukan pencarian transaksi dan tangani bila tidak ditemukan untuk mencegah error server.
Endpoint Webhook Tidak Aman: Gunakan HTTPS dan pastikan endpoint dapat diakses (bukan localhost). Midtrans hanya mengirim ke URL yang bisa diakses publik.
Menyimpan Kunci API di Kode Sumber: Hindari menaruh Server Key langsung di kode. Simpan di file .env dan gunakan config('midtrans.server_key') untuk keamanan.

Dengan menghindari kesalahan di atas, integrasi Midtrans di aplikasi Laravel Anda akan lebih aman dan andal.

Kesimpulan

Tutorial Laravel 11 ini menjelaskan cara lengkap mengintegrasikan payment gateway Midtrans pada proyek e-commerce. Mulai dari persiapan akun Midtrans, konfigurasi Laravel, migrasi database, hingga penanganan frontend dan webhook. Penerapan service-repository pattern membuat kode terstruktur dan mudah dipelihara. Integrasi yang benar memastikan transaksi online berjalan cepat dan aman. Selamat mencoba dan terus kembangkan skill web development Anda!

Selain membaca tutorial, Anda juga dapat memperdalam materi dengan KelasFullstack di CodePolitan. Kelas online ini dirancang untuk membimbing Anda menguasai fullstack web development “from A to Z”, sesuai kebutuhan industri dengan prospek karir dan gaji menjanjikan.

Referensi: Dokumentasi Laravel dan Midtrans.