Selamat datang! Jika Anda seorang pengembang Laravel yang ingin mengintegrasikan sistem pembayaran online ke dalam aplikasi Anda, Anda berada di tempat yang tepat. Dalam artikel ini, kita akan membahas tuntas tentang Laravel Midtrans Tutorial, sebuah panduan lengkap untuk mengintegrasikan Midtrans Payment Gateway ke dalam proyek Laravel Anda. Integrasi ini memungkinkan Anda untuk menerima pembayaran dari berbagai metode, seperti kartu kredit, transfer bank, e-wallet, dan banyak lagi, langsung di aplikasi Anda. Mari kita mulai!

1. Mengapa Memilih Midtrans untuk Integrasi Payment Gateway di Laravel?

Sebelum kita masuk ke detail teknis Laravel Midtrans Tutorial ini, penting untuk memahami mengapa Midtrans menjadi pilihan yang populer di kalangan pengembang Laravel. Ada beberapa alasan kuat:

• Kemudahan Integrasi: Midtrans menawarkan dokumentasi yang komprehensif dan SDK (Software Development Kit) yang mudah digunakan, sehingga memudahkan pengembang untuk mengintegrasikan payment gateway ke dalam aplikasi mereka.
• Berbagai Metode Pembayaran: Midtrans mendukung berbagai metode pembayaran populer di Indonesia, termasuk kartu kredit, debit, transfer bank, e-wallet (GoPay, OVO, Dana), dan pembayaran melalui minimarket (Indomaret, Alfamart). Ini memberikan fleksibilitas kepada pelanggan Anda dalam memilih cara pembayaran yang paling nyaman bagi mereka.
• Keamanan Tingkat Tinggi: Midtrans memprioritaskan keamanan transaksi online. Mereka menggunakan teknologi enkripsi terbaru dan mematuhi standar keamanan industri (PCI DSS) untuk melindungi data sensitif pelanggan Anda.
• Dashboard yang Komprehensif: Midtrans menyediakan dashboard yang intuitif dan mudah digunakan untuk memantau transaksi, melihat laporan, dan mengelola akun Anda.
• Dukungan Teknis yang Responsif: Midtrans menawarkan dukungan teknis yang responsif dan siap membantu Anda jika Anda mengalami masalah selama proses integrasi atau penggunaan.

Dengan semua keuntungan ini, tidak heran jika Midtrans menjadi pilihan utama bagi banyak pengembang Laravel yang ingin menghadirkan pengalaman pembayaran online yang aman dan nyaman bagi pelanggan mereka.

2. Persiapan Awal: Membuat Akun Midtrans dan Mendapatkan Kredensial

Langkah pertama dalam Laravel Midtrans Tutorial ini adalah membuat akun Midtrans dan mendapatkan kredensial yang diperlukan. Kredensial ini akan digunakan untuk menghubungkan aplikasi Laravel Anda dengan server Midtrans.

1. Daftar Akun Midtrans: Kunjungi situs web Midtrans (midtrans.com) dan daftarkan akun. Anda dapat memilih antara akun Sandbox (untuk pengujian) atau akun Production (untuk transaksi live). Sangat disarankan untuk memulai dengan akun Sandbox untuk menguji integrasi Anda secara menyeluruh sebelum beralih ke akun Production.
2. Aktivasi Akun dan Lengkapi Informasi: Ikuti instruksi yang diberikan oleh Midtrans untuk mengaktifkan akun Anda dan melengkapi informasi yang diperlukan, seperti informasi bisnis dan data bank.
3. Dapatkan Kredensial: Setelah akun Anda aktif, masuk ke dashboard Midtrans. Di bagian pengaturan akun, Anda akan menemukan kredensial yang dibutuhkan, yaitu:
   • Client Key: Digunakan untuk menginisialisasi SDK Midtrans di sisi client (browser).
   • Server Key: Digunakan untuk melakukan transaksi dari sisi server (aplikasi Laravel Anda). PENTING: Jaga Server Key Anda dengan aman dan jangan bagikan kepada siapa pun.
   • Merchant ID: Identifikasi unik untuk akun merchant Anda di Midtrans.

Simpan kredensial ini dengan aman. Kita akan menggunakannya di langkah selanjutnya.

3. Instalasi dan Konfigurasi Library Midtrans di Laravel

Sekarang kita akan masuk ke bagian teknis dari Laravel Midtrans Tutorial ini. Kita akan menginstal dan mengkonfigurasi library Midtrans di proyek Laravel Anda.

1. Instal Library Midtrans dengan Composer: Buka terminal atau command prompt di direktori proyek Laravel Anda dan jalankan perintah berikut:

   composer require midtrans/midtrans

   Perintah ini akan mengunduh dan menginstal library Midtrans ke dalam proyek Anda.

2. Konfigurasi Environment Variables (.env): Buka file .env di direktori proyek Anda dan tambahkan variabel berikut dengan nilai kredensial Midtrans yang telah Anda dapatkan sebelumnya:

   MIDTRANS_CLIENT_KEY=YOUR_MIDTRANS_CLIENT_KEY
   MIDTRANS_SERVER_KEY=YOUR_MIDTRANS_SERVER_KEY
   MIDTRANS_MERCHANT_ID=YOUR_MIDTRANS_MERCHANT_ID
   MIDTRANS_IS_PRODUCTION=false  # Ganti dengan 'true' jika Anda menggunakan akun Production

   Pastikan untuk mengganti YOUR_MIDTRANS_CLIENT_KEY, YOUR_MIDTRANS_SERVER_KEY, dan YOUR_MIDTRANS_MERCHANT_ID dengan nilai yang sesuai. Variabel MIDTRANS_IS_PRODUCTION digunakan untuk menentukan apakah aplikasi Anda terhubung ke server Sandbox atau Production. Atur ke false untuk Sandbox dan true untuk Production.

3. Konfigurasi File config/services.php (Opsional): Anda dapat menambahkan konfigurasi Midtrans ke file config/services.php agar lebih terstruktur. Buka file config/services.php dan tambahkan array berikut:

   'midtrans' => [
       'client_key' => env('MIDTRANS_CLIENT_KEY'),
       'server_key' => env('MIDTRANS_SERVER_KEY'),
       'merchant_id' => env('MIDTRANS_MERCHANT_ID'),
       'is_production' => env('MIDTRANS_IS_PRODUCTION', false),
   ],

   Dengan konfigurasi ini, Anda dapat mengakses kredensial Midtrans menggunakan config('services.midtrans.client_key'), config('services.midtrans.server_key'), dan seterusnya.

4. Membuat Controller untuk Mengelola Transaksi Midtrans di Laravel

Selanjutnya dalam Laravel Midtrans Tutorial ini, kita akan membuat controller untuk mengelola transaksi Midtrans di aplikasi Laravel kita. Controller ini akan menangani pembuatan transaksi, pengiriman informasi ke Midtrans, dan penanganan callback dari Midtrans.

1. Buat Controller: Jalankan perintah berikut di terminal untuk membuat controller bernama PaymentController:

   php artisan make:controller PaymentController

2. Tambahkan Kode ke Controller: Buka file app/Http/Controllers/PaymentController.php dan tambahkan kode berikut:

   <?php
   
   namespace AppHttpControllers;
   
   use IlluminateHttpRequest;
   use MidtransConfig;
   use MidtransSnap;
   use MidtransCoreApi;
   
   class PaymentController extends Controller
   {
       public function __construct()
       {
           // Set konfigurasi Midtrans
           Config::$serverKey = config('services.midtrans.server_key');
           Config::$isProduction = config('services.midtrans.is_production');
           Config::$isSanitized = true;
           Config::$is3ds = true;
       }
   
       public function createTransaction(Request $request)
       {
           // Data transaksi dari request (misalnya, dari form input)
           $transactionDetails = $request->only(['order_id', 'gross_amount']);
           $customerDetails = $request->only(['first_name', 'last_name', 'email', 'phone']);
           $itemDetails = $request->input('items'); // Array of item details
   
           // Buat parameter transaksi
           $params = array(
               'transaction_details' => $transactionDetails,
               'customer_details' => $customerDetails,
               'item_details' => $itemDetails,
           );
   
           try {
               // Dapatkan Snap Token dari Midtrans
               $snapToken = Snap::getSnapToken($params);
   
               // Kirim Snap Token ke view
               return view('payment.checkout', ['snapToken' => $snapToken]);
   
           } catch (Exception $e) {
               // Tangani error
               return redirect()->back()->with('error', 'Terjadi kesalahan: ' . $e->getMessage());
           }
       }
   
       public function handleCallback(Request $request)
       {
           $notification = (new CoreApi())->status($request->input('order_id'));
   
           $transaction = $notification->transaction_status;
           $fraud = $notification->fraud_status;
           $order_id = $notification->order_id;
   
           if ($transaction == 'capture') {
               if ($fraud == 'challenge') {
                   // TODO Set payment status in merchant's database to 'challenge'.
                   // and response to Midtrans [HTTP 200 OK]
                   $this->updatePaymentStatus($order_id, 'challenge');
               } else if ($fraud == 'accept') {
                   // TODO Set payment status in merchant's database to 'success'.
                   // and response to Midtrans [HTTP 200 OK]
                   $this->updatePaymentStatus($order_id, 'success');
               }
           } else if ($transaction == 'settlement') {
               // TODO set payment status in merchant's database to 'Settlement'.
               // and response to Midtrans [HTTP 200 OK]
               $this->updatePaymentStatus($order_id, 'settlement');
           } else if ($transaction == 'pending') {
               // TODO set payment status in merchant's database to 'Pending'.
               // and response to Midtrans [HTTP 200 OK]
               $this->updatePaymentStatus($order_id, 'pending');
           } else if ($transaction == 'deny') {
               // TODO set payment status in merchant's database to 'Denied'.
               // and response to Midtrans [HTTP 200 OK]
               $this->updatePaymentStatus($order_id, 'deny');
           } else if ($transaction == 'expire') {
               // TODO set payment status in merchant's database to 'expire'.
               // and response to Midtrans [HTTP 200 OK]
               $this->updatePaymentStatus($order_id, 'expire');
           } else if ($transaction == 'cancel') {
               // TODO set payment status in merchant's database to 'cancel'.
               // and response to Midtrans [HTTP 200 OK]
               $this->updatePaymentStatus($order_id, 'cancel');
           }
   
           return response('OK', 200);
       }
   
       private function updatePaymentStatus($order_id, $status) {
           // Logic to update payment status in your database
           // Example:
           // DB::table('orders')->where('order_id', $order_id)->update(['payment_status' => $status]);
           // Replace the above line with your actual database update logic
           Log::info("Order ID: $order_id, Status: $status"); // Log the status update
       }
   }

   Penjelasan Kode:

   • __construct(): Konstruktor ini mengatur konfigurasi Midtrans menggunakan nilai dari file .env.
   • createTransaction(Request $request): Fungsi ini menerima data transaksi dari request (biasanya dari form input). Data ini mencakup detail transaksi (order_id, gross_amount), detail pelanggan (first_name, last_name, email, phone), dan detail item (items). Kemudian, fungsi ini membuat parameter transaksi yang sesuai dan menggunakan fungsi Snap::getSnapToken() untuk mendapatkan Snap Token dari Midtrans. Snap Token ini kemudian dikirim ke view payment.checkout untuk menampilkan halaman pembayaran Midtrans.
   • handleCallback(Request $request): Fungsi ini menangani callback dari Midtrans. Ketika pembayaran selesai, Midtrans akan mengirimkan data transaksi ke endpoint ini. Fungsi ini kemudian memverifikasi status transaksi dan memperbarui status pembayaran di database Anda. Penting untuk dicatat bahwa Anda perlu mengimplementasikan logika updatePaymentStatus() untuk memperbarui status pembayaran di database Anda.
   • updatePaymentStatus($order_id, $status): Fungsi ini (yang perlu Anda implementasikan) bertanggung jawab untuk memperbarui status pembayaran di database Anda berdasarkan data yang diterima dari Midtrans. Contoh kode yang diberikan hanyalah placeholder; Anda perlu menggantinya dengan logika yang sesuai dengan struktur database Anda.

5. Membuat Route untuk Mengakses Controller

Setelah membuat controller, kita perlu membuat route untuk mengakses fungsi-fungsi di dalam controller.

1. Buka file routes/web.php: Buka file routes/web.php di direktori proyek Anda.

2. Tambahkan Route: Tambahkan route berikut ke file routes/web.php:

   Route::post('/payment/create', [AppHttpControllersPaymentController::class, 'createTransaction'])->name('payment.create');
   Route::post('/payment/callback', [AppHttpControllersPaymentController::class, 'handleCallback'])->name('payment.callback');

   Route ini akan mengarahkan permintaan POST ke /payment/create ke fungsi createTransaction() di PaymentController dan permintaan POST ke /payment/callback ke fungsi handleCallback().

6. Membuat View untuk Menampilkan Halaman Pembayaran Midtrans (Checkout)

Sekarang kita akan membuat view untuk menampilkan halaman pembayaran Midtrans menggunakan Snap.

1. Buat File View: Buat file bernama checkout.blade.php di direktori resources/views/payment.

2. Tambahkan Kode HTML dan JavaScript: Tambahkan kode berikut ke file checkout.blade.php:

   <!DOCTYPE html>
   <html>
   <head>
       <title>Checkout Pembayaran</title>
       <!-- @TODO: replace SET_YOUR_CLIENT_KEY_HERE with your client key -->
       <script type="text/javascript"
         src="https://app.sandbox.midtrans.com/snap/snap.js"
         data-client-key="{{ $snapToken }}">
       </script>
       <!-- Note: replace with src="https://app.midtrans.com/snap/snap.js" for Production environment -->
   </head>
   <body>
       <button id="pay-button">Bayar Sekarang!</button>
       <pre><div id="result-json">JSON result will appear here after payment:<br></div></pre>
   
       <script type="text/javascript">
         document.getElementById('pay-button').onclick = function(){
           // SnapToken acquired from the controller.
           snap.pay('{{ $snapToken }}', {
             // Optional
             onSuccess: function(result){
               /* You may add your own implementation here
                * e.g. show success message */
               console.log(result);
               document.getElementById('result-json').innerHTML += JSON.stringify(result, null, 2);
             },
             // Optional
             onPending: function(result){
               /* You may add your own implementation here
                * e.g. show waiting message */
               console.log(result);
               document.getElementById('result-json').innerHTML += JSON.stringify(result, null, 2);
             },
             // Optional
             onError: function(result){
               /* You may add your own implementation here
                * e.g. show error message */
               console.log(result);
               document.getElementById('result-json').innerHTML += JSON.stringify(result, null, 2);
             }
           });
         };
       </script>
   </body>
   </html>

   Penjelasan Kode:

   • Kode ini menggunakan library Snap dari Midtrans untuk menampilkan halaman pembayaran.
   • data-client-key="{{ $snapToken }}": Mengirimkan Snap Token yang diterima dari controller ke library Snap.
   • JavaScript: Kode JavaScript menangani klik pada tombol “Bayar Sekarang!” dan memanggil fungsi snap.pay() untuk menampilkan halaman pembayaran Midtrans. Fungsi onSuccess(), onPending(), dan onError() adalah fungsi callback yang dipanggil ketika pembayaran berhasil, tertunda, atau gagal. Anda dapat menambahkan logika Anda sendiri di dalam fungsi-fungsi ini untuk menangani berbagai status pembayaran.

7. Membuat Form untuk Mengirim Data Transaksi

Kita perlu membuat form yang memungkinkan pengguna untuk memasukkan data transaksi dan mengirimkannya ke controller.

1. Buat View untuk Form: Buat file view (misalnya, order.blade.php) yang berisi form untuk memasukkan data transaksi.

2. Tambahkan Kode HTML Form: Tambahkan kode HTML berikut ke file view order.blade.php:

   <form action="{{ route('payment.create') }}" method="POST">
       @csrf
       <label for="order_id">Order ID:</label><br>
       <input type="text" id="order_id" name="order_id" value="{{ uniqid() }}" readonly><br><br>
   
       <label for="gross_amount">Gross Amount:</label><br>
       <input type="number" id="gross_amount" name="gross_amount" value="20000"><br><br>
   
       <label for="first_name">First Name:</label><br>
       <input type="text" id="first_name" name="first_name" value="John"><br><br>
   
       <label for="last_name">Last Name:</label><br>
       <input type="text" id="last_name" name="last_name" value="Doe"><br><br>
   
       <label for="email">Email:</label><br>
       <input type="email" id="email" name="email" value="[email protected]"><br><br>
   
       <label for="phone">Phone:</label><br>
       <input type="text" id="phone" name="phone" value="081234567890"><br><br>
   
       <input type="hidden" name="items[0][id]" value="ITEM001">
       <input type="hidden" name="items[0][price]" value="20000">
       <input type="hidden" name="items[0][quantity]" value="1">
       <input type="hidden" name="items[0][name]" value="Testing Product">
       <button type="submit">Buat Transaksi</button>
   </form>

   Penjelasan Kode:

   • Form ini mengirimkan data transaksi ke route payment.create menggunakan metode POST.
   • Field order_id diisi secara otomatis dengan ID unik menggunakan fungsi uniqid().
   • Field gross_amount adalah jumlah total yang harus dibayarkan.
   • Field first_name, last_name, email, dan phone adalah informasi pelanggan.
   • Field items adalah array yang berisi detail item yang dibeli. Dalam contoh ini, hanya ada satu item.
   • Tombol “Buat Transaksi” mengirimkan form ke controller.

8. Menguji Integrasi Midtrans Laravel Anda

Setelah menyelesaikan semua langkah di atas, sekarang saatnya untuk menguji integrasi Midtrans Laravel Anda.

1. Jalankan Aplikasi Laravel Anda: Jalankan perintah php artisan serve di terminal untuk menjalankan aplikasi Laravel Anda.
2. Akses Form Pemesanan: Buka browser Anda dan akses view yang berisi form pemesanan (misalnya, order.blade.php).
3. Isi Form dan Kirim: Isi form dengan data transaksi yang valid dan kirimkan.
4. Halaman Pembayaran Midtrans: Anda akan diarahkan ke halaman pembayaran Midtrans. Ikuti instruksi di halaman pembayaran untuk menyelesaikan transaksi.
5. Verifikasi Callback: Setelah pembayaran selesai, Midtrans akan mengirimkan callback ke endpoint /payment/callback di aplikasi Anda. Periksa log aplikasi Anda untuk memastikan bahwa callback diterima dan diproses dengan benar.
6. Periksa Status Pembayaran di Database: Pastikan bahwa status pembayaran di database Anda telah diperbarui sesuai dengan status transaksi di Midtrans.

Jika Anda mengalami masalah selama proses pengujian, periksa log aplikasi Anda untuk mencari pesan error. Anda juga dapat menghubungi dukungan teknis Midtrans untuk mendapatkan bantuan.

9. Tips dan Trik Tambahan untuk Integrasi Laravel Midtrans yang Lebih Baik

Berikut adalah beberapa tips dan trik tambahan untuk meningkatkan integrasi Laravel Midtrans Anda:

• Validasi Data: Selalu validasi data yang diterima dari form sebelum mengirimkannya ke Midtrans. Ini akan membantu mencegah error dan memastikan bahwa data transaksi akurat.
• Handling Error: Tangani error dengan baik di controller Anda. Tampilkan pesan error yang informatif kepada pengguna jika terjadi kesalahan.
• Logging: Gunakan logging untuk mencatat semua transaksi dan aktivitas yang terkait dengan Midtrans. Ini akan membantu Anda untuk memantau integrasi Anda dan memecahkan masalah jika terjadi kesalahan.
• Keamanan: Pastikan untuk menyimpan Server Key Midtrans Anda dengan aman dan jangan bagikan kepada siapa pun. Gunakan HTTPS untuk semua komunikasi antara aplikasi Anda dan server Midtrans.
• Gunakan Webhook: Gunakan webhook Midtrans untuk mendapatkan notifikasi real-time tentang status transaksi. Webhook lebih andal daripada mengandalkan callback.
• Otomatisasi: Otomatiskan proses pembuatan invoice dan pengiriman email konfirmasi setelah pembayaran berhasil.
• Uji Coba Reguler: Lakukan uji coba reguler terhadap integrasi Midtrans Anda untuk memastikan bahwa semuanya berfungsi dengan baik.

10. Kesimpulan: Integrasi Payment Gateway yang Sukses dengan Laravel Midtrans

Selamat! Anda telah berhasil menyelesaikan Laravel Midtrans Tutorial ini. Anda sekarang memiliki pengetahuan yang diperlukan untuk mengintegrasikan Midtrans Payment Gateway ke dalam aplikasi Laravel Anda. Dengan integrasi ini, Anda dapat menerima pembayaran online dengan mudah dan aman dari berbagai metode pembayaran. Ingatlah untuk selalu menguji integrasi Anda secara menyeluruh dan mengikuti praktik keamanan terbaik. Semoga berhasil!

Dengan panduan lengkap ini, Anda siap untuk membawa aplikasi Laravel Anda ke tingkat berikutnya dengan integrasi pembayaran online yang mulus dan efisien menggunakan Midtrans. Jangan ragu untuk menjelajahi dokumentasi Midtrans lebih lanjut untuk fitur dan opsi konfigurasi yang lebih canggih. Selamat berkarya!