Implementasi Callback Xendit dengan PHP dan CPanel

Selamat datang! Artikel ini bertujuan untuk memandu Anda untuk melakukan implementasi callback Xendit dari PHP dan CPanel untuk menerima pesan callback dari Xendit.

Disini, kami akan menjelaskan apa itu Callback/Webhook, bagaimana cara kerjanya, serta bagaimana Anda dapat dengan mudah mengintegrasikan Callback Xendit ke sistem atau aplikasi Anda.

Tutorial ini akan menggunakan Invoice / Checkout API sebagai contoh implementasi, namun tutorial ini tidak terbatas untuk diaplikasikan pada API Xendit lainnya.

Apa itu Callback? Dan Bagaimana Cara Kerjanya?

Callback atau sering disebut sebagai Webhook merupakan sebuah mekanisme pengiriman pesan secara asynchronous dari satu sistem ke sistem lain. Di Xendit, callback/webhook merupakan suatu proses notifikasi dari sistem Xendit ke sistem Anda yang dilakukan secara asynchronous, yang umumnya digunakan untuk mengirimkan notifikasi pembayaran, seperti pembayaran berhasil, sehingga sistem Anda dapat menjalankan proses selanjutnya seperti mengirimkan barang atau jasa kepada pembeli Anda.

Ilustrasi berikut menunjukkan alur transaksi antara pelanggan Anda, Anda sebagai pemilik bisnis, dan Xendit

Contoh: Anda adalah seorang pebisnis atau pengguna terdaftar Xendit. Anda kemudian membangun situs web Anda untuk menerima pembayaran dari pelanggan menggunakan Xendit. Anda memulai integrasi dengan Xendit untuk menerima pembayaran melalui salah satu produk kami.

Pertama, Anda akan melakukan panggilan API ke Xendit untuk memulai transaksi yang dibuat oleh pelanggan, contohnya Buat Invoice. Setelah panggilan API berhasil, Invoice akan dibuat dan Anda dapat mengirimkan tautan / QR code Invoice ke pembeli Anda untuk menyelesaikan pembayaran.

Ketika ada pembayaran yang berhasil (atau gagal) diterima oleh Xendit, kami akan mengirimkan callback pembayaran tersebut melalui HTTP POST ke callback URL yang Anda daftarkan. Setelah Anda menerima callback dari kami, Anda dapat membuat pengalaman pembeli Anda sendiri di aplikasi atau website Anda dengan menunjukkan halaman keberhasilan atau kegagalan kepada pelanggan.

Callback sejatinya adalah kebalikan dari API. Bila API dimulai dari sistem Anda yang mengirimkan request dan Xendit mengembalikan respon, Callback/Webhook adalah sebaliknya. Untuk alur Callback, Xendit akan mengirimkan request ke sistem Anda dan Anda mengembalikan respon ke kami bahwa sistem Anda telah menerima Callback kami.

Ilustrasi di bawah menggambarkan perbedaan alur API dan Callback/Webhook untuk pembuatan pembayaran

Penjelasan lebih lanjut dapat ditemukan di sini.

Sekian penjelasan singkat mengenai apa itu callback dan bagaimana cara kerjanya. Sekarang, mari kita lanjutkan ke cara mengatur akun Xendit Anda dan mendaftarkan URL callback Anda.

Menyetel Pengaturan Callback Anda

Langkah pertama, registrasi atau login akun Xendit melalui https://dashboard.xendit.co/register/1

Setelah Anda menyelesaikan proses pendaftaran, Anda akan diarahkan ke dasbor Anda.

Anda dapat mencoba melakukan panggilan API melalui Referensi API kami. Jika Anda masih tidak yakin bagaimana melakukan panggilan API pertama Anda, artikel "Melakukan Panggilan API Pertama Anda dengan Xendit" ini akan segera memandu Anda. Setelah Anda melakukan panggilan pertama, saatnya Anda menyiapkan URL callback. ya!

Pertama, Di dasbor Anda, klik Setelan.

Anda kemudian akan melihat halaman ini

Selanjutnya, klik Callbacks seperti yang disorot pada gambar di atas.

Pastikan setelan Pengiriman Ulang Otomatis telah aktif untuk mengirim ulang callback yang gagal secara otomatis. Fitur ini berguna apabila sistem Anda sedang mengalami kendala atau tidak tersedia, sehingga callback yang gagal akan dikirimkan secara otomatis.

Selanjutnya, adalah untuk mendapatkan token verifikasi callback Anda. Klik Lihat Token Verifikasi Callback, Masukkan kata sandi Anda, dan simpan token itu di dalam sisi server Anda, yang akan dijelaskan lebih lanjut di bagian Implementasi di bawah.

Setelah semua di atas telah disetel, Anda memiliki satu langkah terakhir untuk menyelesaikan instalasi callback Anda, yaitu menyetel URL callback. Anda dapat mengisi URL Anda di bagian Callback URL sesuai dengan produk yang Anda gunakan dengan Xendit.

Dalam konteks ini, kami akan menggunakan Invoice sebagai contoh untuk callback Anda. Agar Anda dapat menyiapkan callback, Anda harus memiliki URL untuk mendengarkan callback. Dalam contoh ini, saya menggunakan https://hendry-sukses.com/webhook.php sebagai contoh untuk referensi Anda.

Setelah selesai, klik Tes dan Simpan. Anda mungkin melihat NO_RESPONSE, tetapi jangan khawatir. Ini normal dan diharapkan, karena Anda mungkin belum menyetel pendengar untuk set URL callback, yang akan dijelaskan lebih lanjut dibawah.

Buat Implementasi Callback pada PHP melalui CPANEL

Anda telah mendaftarkan akun dengan Xendit, membuat panggilan API pertama Anda, mengatur callback pada pengaturan callback. Anda siap untuk melanjutkan ke langkah berikutnya, yaitu membuat implementasi callback di sistem Anda untuk mendengar dan menerima callback dari Xendit.

Sebelumnya, kita telah menyetel URL callback untuk event invoice ke https://hendry-sukses.com/webhook.php, dengan asumsi domainnya adalah https://hendry-sukses.com dan /webhook.php adalah jalur di mana callback akan terjadi. Harap pastikan domain Anda sudah siap, dan dapat melampirkan tautan atau URL Anda sebagai pendengar callback.

Mari kita mulai menulis beberapa Kode PHP di webhook.php sebagai listener untuk callback invoice.

Jika Anda menggunakan CPANEL, navigasi ke File Manager, klik + File, dan tambah file baru dengan nama webhook.php

Setelah webhook.php dibuat, Anda dapat mengklik tombol Edit, dan Anda akan melihat prompt di bawah ini. Pastikan Anda memilih utf-8 dan klik Edit.

Setelah Anda klik Edit, Anda akan diarahkan ke editor online Cpanel.

Kita sekarang akan menulis listener di webhook.php yang akan mengekspos ke domain https://hendry-sukses.com/webhook.php.

Pastikan Anda telah membaca pedoman Praktik Terbaik callback Xendit dalam hal:

Pengaturan
Memahami Upaya Pengiriman Percobaan Ulang
Penanganan Peristiwa
Keamanan

Mari kita coba implementasi!

Berikut cuplikan kode pemrograman PHP untuk menerima dan merespon callback dari Xendit beserta penjelasannya

<?php

// Ini akan menjadi Token Verifikasi Callback Anda yang dapat Anda peroleh dari dasbor.
// Pastikan untuk menjaga kerahasiaan token ini dan tidak mengungkapkannya kepada siapa pun.
// Token ini akan digunakan untuk melakukan verfikasi pesan callback bahwa pengirim callback tersebut adalah Xendit
$xenditXCallbackToken = 'Token callback Verifikasi Xendit Anda Di Sini';

// Bagian ini untuk mendapatkan Token callback dari permintaan header, 
// yang kemudian akan dibandingkan dengan token verifikasi callback Xendit
$reqHeaders = getallheaders();
$xIncomingCallbackTokenHeader = isset($reqHeaders['x-callback-token']) ? $reqHeaders['x-callback-token'] : "";

// Untuk memastikan permintaan datang dari Xendit
// Anda harus membandingkan token yang masuk sama dengan token verifikasi callback Anda
// Ini untuk memastikan permintaan datang dari Xendit dan bukan dari pihak ketiga lainnya.
if($xIncomingCallbackTokenHeader === $xenditXCallbackToken){
  // Permintaan masuk diverifikasi berasal dari Xendit
    
  // Baris ini untuk mendapatkan semua input pesan dalam format JSON teks mentah
  $rawRequestInput = file_get_contents("php://input");
  // Baris ini melakukan format input mentah menjadi array asosiatif
  $arrRequestInput = json_decode($rawRequestInput, true);
  print_r($arrRequestInput);
  
  $_id = $arrRequestInput['id'];
  $_externalId = $arrRequestInput['external_id'];
  $_userId = $arrRequestInput['user_id'];
  $_status = $arrRequestInput['status'];
  $_paidAmount = $arrRequestInput['paid_amount'];
  $_paidAt = $arrRequestInput['paid_at'];
  $_paymentChannel = $arrRequestInput['payment_channel'];
  $_paymentDestination = $arrRequestInput['payment_destination'];

  // Kamu bisa menggunakan array objek diatas sebagai informasi callback yang dapat digunaka untuk melakukan pengecekan atau aktivas tertentu di aplikasi atau sistem kamu.

}else{
  // Permintaan bukan dari Xendit, tolak dan buang pesan dengan HTTP status 403
  http_response_code(403);
}

Salin dan tempel kode di atas ke webhook.php Anda. Sebagai tambahan, baris print_r($arrRequestInput) akan membuktikan apakah URL callback berfungsi sesuai yang diharapkan dan dapat menerima request dari Xendit dan mengembalikan respon yang sesuai.

Sampai saat ini, seharusnya Anda telah melakukan langkah-langkah berikut:

Menyiapkan URL callback
Menuliskan implementasi kode untuk menerima dan merespon callback
Verifikasi identitas pengirim callback dengan verifikasi Token Callback Xendit
Mengembalikan kode respon 200 setelah proses pendengaran berakhir

Mari kita coba kodenya ;) melalui pengaturan callback lagi.

Voila!!! Anda berhasil melakukan callback pertama dengan sukses 🥳

Anda juga dapat melakukan banyak hal pada callback ini seperti:

Menangani pesan dan melakukan aksi pada aplikasi atau website Anda berdasarkan status berhasil atau gagal pada Invoice atau callback lainnya
Menyimpan log ke server Anda sendiri untuk memudahkan investigasi masalah
Penanganan event duplikat, pastikan proses Anda hanya terjadi sekali, dan blokir jika ada lebih dari satu permintaan.

Anda sekarang sudah siap untuk menerima callback dari Xendit. Kami harap tutorial ini dapat membantu Anda. Selamat mencoba dan kami harap integrasi Anda lancar!

Last Updated on 2023-06-02

Apa itu Callback? Dan Bagaimana Cara Kerjanya?
Menyetel Pengaturan Callback Anda
Buat Implementasi Callback pada PHP melalui CPANEL