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?

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/tutorial_laravel.png)

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:

1. **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.
2. **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.
3. **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.

**Baca Juga:** [Yuk, Kenalan dan Belajar Laravel Pint](https://www.codepolitan.com/blog/yuk-kenalan-dan-belajar-laravel-pint/)

## 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
  <?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:

  ```php
  $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:

1. **Controller Pembayaran**: Buat controller dengan `php artisan make:controller PaymentController`.

   ```php
   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']
           ]);
       }
   }
   ```
2. **Binding Repository**: Daftarkan binding di `App\Providers\AppServiceProvider`:

   ```php
   use App\Repositories\TransactionRepositoryInterface;
   use App\Repositories\TransactionRepository;

   public function register()
   {
       $this->app->bind(TransactionRepositoryInterface::class, TransactionRepository::class);
   }
   ```
3. **Route Checkout**: Tambahkan route untuk checkout di `routes/web.php`:

   ```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:

```html
<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.

**Baca Juga:** [Teknik Caching Laravel 11: Optimalkan Aplikasi dengan Cache](https://www.codepolitan.com/blog/teknik-caching-laravel-11-optimalkan-aplikasi-dengan-cache/)

## 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:

1. **Route Webhook**: Tambahkan route khusus di `routes/web.php`:

   ```php
   Route::post('/midtrans/webhook', [PaymentController::class, 'handleWebhook']);
   ```
2. **Metode handleWebhook**: Di `PaymentController`, tambahkan fungsi untuk memproses notifikasi:

   ```php
   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.
3. **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:

1. **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.
2. **Mengabaikan Semua Status Transaksi**: Hanya menangani status sukses (paid) saja. Pastikan Anda juga menangani status `pending`, `cancel`, `expire` agar aplikasi tidak salah klasifikasi transaksi.
3. **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.
4. **Endpoint Webhook Tidak Aman**: Gunakan HTTPS dan pastikan endpoint dapat diakses (bukan localhost). Midtrans hanya mengirim ke URL yang bisa diakses publik.
5. **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!

[![](https://image.web.id/images/belajar-coding-gratis.png)](https://www.kelasfullstack.id/project)

Selain membaca tutorial, Anda juga dapat memperdalam materi dengan [**KelasFullstack**](https://www.kelasfullstack.id/project) 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*.

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

GenAI Video Fest adalah ajang kompetisi video kreatif yang diselenggarakan oleh CODEPOLITAN bekerjasama dengan Alibaba Cloud.

Kami menantang kreator, tech-enthusiast, dan siapa saja untuk mendobrak batas imajinasi menggunakan teknologi Generative AI terbaru. Di sini, kamu wajib menggunakan WAN Model Studio dari Alibaba Cloud sebagai tools utama untuk menghasilkan karya videomu (bisa dikombinasikan dengan tools editing lainnya).

Tunjukkan pada dunia bagaimana teknologi dan kreativitas bisa bersatu menciptakan karya visual yang berdampak!

Kategori Kompetisi
Pilih satu dari empat tema besar ini untuk karyamu:
* Humanity (Kemanusiaan): Cerita yang menyentuh hati, sosial, dan kepedulian antar sesama.
* Sports (Olahraga): Energi, semangat juang, dan dinamika dunia olahraga.
* Entertainment (Hiburan): Komedi, musik, video klip, atau parodi yang menghibur.
* Science (Sains): Visualisasi masa depan, teknologi, alam semesta, atau penemuan ilmiah.

Total Prize Pool senilai Rp 250.000.000 menunggu para pemenang!
* Top Winners Rewards: Uang Tunai, Alibaba Cloud Credits (hingga $500), Merchandise Eksklusif, dan SWAG CODEPOLITAN.
* Lucky Draw Event: Kesempatan menang hadiah tambahan bagi peserta yang beruntung.
* Massive Exposure: Karya terbaik akan di-highlight di media sosial CODEPOLITAN, Alibaba Cloud, dan channel industri kreatif lainnya.
* Special Access (Khusus Alumni RuangAI): Dapatkan 2 Token untuk klaim Kelas Spesialisasi di RuangAI secara gratis.

Jangan sampai ketinggalan tanggal penting ini:
* Pendaftaran & Submission: 23 Desember 2024 - 23 Januari 2025
* Penjurian (Judging Phase): 24 - 26 Januari 2025
* Pengumuman Pemenang: 27 Januari 2025

Cara Ikutan:
1. Daftar: Klik tombol "Daftar Sekarang" dan pastikan kamu punya akun RuangAI.
2. Join Discord: Masuk ke server Discord komunitas untuk info teknis dan diskusi.
3. Create: Buat video kreatifmu menggunakan WAN Model Studio (Alibaba Cloud) sesuai kategori pilihan.
4. Upload & Submit: Unggah videomu ke media sosial (IG/TikTok/YouTube) dan submit link karyamu di halaman submission RuangAI.

Ikuti kompetisi video Generative AI terbesar dari CODEPOLITAN dan Alibaba Cloud! Gunakan teknologi WAN Model Studio untuk menyulap ide liarmu menjadi visual memukau. Rebut total hadiah senilai Rp 250.000.000!

GenAI Video Fest

Beasiswa Basic Cybersecurity adalah program inisiatif dari JagoanSiber yang dirancang untuk membuka wawasan masyarakat luas tentang dunia keamanan digital. Program ini hadir untuk menjawab kebutuhan talenta keamanan siber yang tinggi, dimulai dengan membangun pemahaman fundamental yang kokoh.

Program ini berbentuk Kelas Online Belajar Mandiri (Self-Paced Learning) berbasis video. Peserta diberikan keleluasaan penuh untuk mengakses materi kapan saja dan di mana saja tanpa terikat jadwal, sehingga sangat fleksibel bagi pelajar, mahasiswa, maupun pekerja profesional.

Kelebihan utama program ini adalah aksesnya yang 100% GRATIS dan terbuka untuk siapa saja tanpa syarat latar belakang IT. Peserta akan dibimbing langsung oleh Mahrus Qusaery, seorang praktisi keamanan siber berpengalaman, yang akan mengupas tuntas materi dasar yang krusial.

Program beasiswa kelas online gratis untuk mempelajari dasar keamanan siber dari nol. Belajar mandiri berbasis video langsung dari praktisi ahli, Mahrus Qusaery.

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

Learning

KelasFullstack

RuangAI

JagoanSiber

Baca Artikel Lainnya

ChatGPT adalah Kawan atau Lawan Bagi Programmer?

Belajar Membangun Proyek Open Source, Emang bisa?

13+ Rahasia Dibalik Skills Frontend Developer di Buru Perusahaan

10 Tips & Trik Penggunaan Shortcut Vscode, Pelajari Yuk!

Cara Menghapus Commit Git: Panduan Praktis dan Terbaik!

Tingkatkan Teknologi AI, Indonesia Jalin Kerjasama dengan AS