Introduction
Welcome to Empatkali API!
Empatkali API is a RESTful Web Service served as a communication bridge between merchants and our payment channels.
API Base URL
Sandbox : https://sb-api.empatkali.co.id/merchant/api
Production : https://api.empatkali.co.id/merchant/api
Overview
- User performs the checkout operation
- Merchant site open an iframe that contain some payload open EMPATKALI payment page
- EMPATKALI server will verify the request
- EMPATKALI User fill in phone number and OTP for transaction
- EMPATKALI server will verify the request and process the payment
- If the payment success EMPATKALI will send EMAIL to registered Merchant email and EMPATKALI User Email
- If the payment success EMPATKALI backend will send HTTPS POST Request to Merchant registered callback URL containing transaction information.
Supported Browsers
We try to support the latest versions of all major browsers. The list below provides the minimum supported version of each browser in Mobile and Desktop platform :
Mobile
- Chrome 32 and above
- Android 4.4 and above
- Safari 8 and above
- BlackBerry 10 and above
Dekstop
- Chrome 26 and above
- Firefox 29 and above
- Internet Explorer 10 and above
- Safari 6 and above
On Board With EMPATKALI
To start using EMPATKALI plugin, you have to register for EMPATKALI merchant account here.
Once you have registered on website, EMPATKALI will check your data and send you the credential for login to Merchant Dashboard
Example:
- Username :
Username_Merchant
- Password :
xxxxxxxxxxx
- Secret Key :
EMPATKALI Will provide this key
Note:
Production key and URL will be provided when going live
Backend Integration
Empatkali API integration is easy to use, just follow the steps below along with its required body and you're good to go.
(1) User Validation
Authenticate the user -- this endpoint generate md5 for system checking is it true this transaction from empatkali system --
Example Request (JSON format)
{
"storeId": "xxxxxx",
"total": "xxxxxx",
"transactionNumber": "xxxxxx",
"mobileNumber": "xxxxxx"
}
API Methods
Endpoint | HTTP Method |
---|---|
/approvedtransactions/generateal |
POST |
Request Body
Parameter | Type | Description |
---|---|---|
storeId |
ObjectId | Merchants store ID |
total |
Float | Total transaction amount |
transactionNumber |
String | Transaction Number |
(2) Pre-approve Transaction
Preparing the "transaction" which will later be process -- to create pre transaction in empatkali db --
Example Request (JSON format)
{
"terminDuration" : 14 || 30,
"transactionNumber": "xxxxxx",
"amount": "xxxxxx",
"user_mobileNumber": "xxxxxx",
"store": "xxxxxx",
"md5": "xxxxxx",
"token": "xxxxxx"
}
API Methods
Endpoint | HTTP Method |
---|---|
/preapprovedtransactions?store=true |
POST |
Request Body
Parameter | Type | Description |
---|---|---|
terminDuration |
String | Termin 14 for 2 weeks pay or 30 for 1 month pay |
transactionNumber |
String | Transaction Number |
amount |
Float | Total transaction amount |
user_mobileNumber |
String | User Mobile Number |
store |
ObjectId | Merchants store ID |
md5 |
String | generated if user has been successfully authenticated (refer to step 1) |
token |
String | this is generated inside mobile appss which the user will provide |
(3) Pre-approve Transaction Token
Generate token -- to initial pre approvetransaction to process to empatkali sysmte with throw CVV card user --
Example Request (JSON format)
{
"storeId": "xxxxxx",
"transactionNumber": "xxxxxx",
"card_cvv": "xxxxxx"
}
API Methods
Endpoint | HTTP Method |
---|---|
/preapprovedtransactions/token |
POST |
Request Body
Parameter | Type | Description |
---|---|---|
storeId |
ObjectId | Merchants store ID |
transactionNumber |
String | Transaction Number |
card_cvv |
String | User input his/her CVV |
(4) Process Transaction
This will finalize the transaction process. -- to finalize transaction and checking the transaction already process pay from user or not, if already pay transaction create if not transaction not transaction failure --
Example Request (JSON format)
{
"transactionNumber": "xxxxxx"
}
API Methods
Endpoint | HTTP Method |
---|---|
/approvedtransactions/v3 |
POST |
Request Body
Parameter | Type | Description |
---|---|---|
transactionNumber |
String | Transaction Number |
Custom Field
Response
{
"transactionNumber": "__yourTransactionID__",
"amount": 1000000,
"user_mobileNumber": "__mobilenumber__",
"store": "__yourStore_Id__",
"md5": "__md5generate__",
"token": "__paymentPIN__"
"customField1": xxxxxxxxx,
"customField2": xxxxxxxxx,
"customField3": xxxxxxxxx,
"customField4": xxxxxxxxx,
"customField5": xxxxxxxxx
}
Set Custom Fields is a feature that enables merchants to charge a transaction with a unique data according to the merchant's need. EMPATKALI provides merchants with 5 custom fields that can be used for various utilities. Convention of a custom field can be set when merchant request transaction
JSON Attribute | Type | Description |
---|---|---|
customField1 | String() | The value of custom field 1 |
customField2 | String() | The value of custom field 2 |
customField3 | String() | The value of custom field 3 |
customField4 | String() | The value of custom field 4 |
customField5 | String() | The value of custom field 5 |
Frontend Integration
Overview
Add this before
</head>
tag
<link rel="stylesheet" href="https://empatkali.co.id/__d/payment.css" />
Add this before
</body>
tag
<!--
This a sample Checkout Button EMPATKALI
"href" attribute is pointing to
"https://sandbox-portal.empatkali.co.id"
having required query strings i.e.
- store_id
- total (total amount of the transaction)
- Add transaction Id
- Add Redirect URL
Note:
- Add transaction Id
- if you throw this parameter system will use this if not system will generate the orderId / transaction Number
- ex: transaction_id=__yourOrderID__
- Add Redirect URL
- transaction already process system will redirecting to url you set
- ex: redirect_url = __linkRedirect__ -- if you throw this parameter after
- Generate md5 value
- do POST method with using this endpoint: "https://sb-api.empatkali.co.id/merchant/api/approvedtransactions/generateal"
** Required Params:
- storeId
- total
- transactionNumber
Ex:
{
"storeId": “123019203dadjajda80f904df",
"total": "100000",
"transactionNumber”:”invoice001"
}
-->
<button class='iframe'
href="https://sandbox-portal.empatkali.co.id/index.php?total=__amount__&store_id=__yourStoreId__&transaction_id=__transactionId__&md5=md5ValueFrom_GenerateALAPI&redirect_url=__linkRedirect__&base_url=urlMerchantWebsite">
<img src="https://empatkali.co.id/assets/img/logo-final.png" style="width: 16px; height: 16px"/>
EMPATKALI
</button>
<!-- this will import the necessary javascript -->
<script src="https://empatkali.co.id/__d/payment.js"></script>
<!-- feel free to adjust the dimension -->
<script>
$(document).ready(function(){
$(".iframe").colorbox({
iframe:true,
width:"500px",
height:"580px",
escKey: false,
overlayClose: false
});
});
</script>
A Process flow diagram on how to Create Payment Transaction
(click image to enlarge)
Overview :
1. User send value amount and phone number OR Scan QR
2. E-Commerce System Send to Empatkali
{/api/preapprovedtransactions}
Send value : storeId, secret, total, transactionNumber
3. Empatkali will send response for create payment process
4. if process Create Payment 'Success'
E-Commerce connect socket to listen process from server 4x
5. Send callback to E-Commerce
formula generate code md5 (PHP);
$md5 = md5($_POST['amount'] . $_POST['invoice_number'] . $_POST[Storeid] . Secret')
;
Redirect Integration Process
Overview
Flow on how the redirect integration process
(click image to enlarge)
- User transacts to any merchant supported by Empatkali
- Merchant will then send request to Empatkali API to create payment
- Empatkali will send response after processing the create payment request from merchant
- If success, merchant will connect via socket and be process by Empatkali server
- Once processed, Empatkali will send a callback
Implementation
A step-by-step implementation of the redirect integration process.
1. Request an MD5
Create the md5 value as required for the next step.
Sample Request
{
"storeId": "1234567890",
"total": "1000",
"transactionNumber":"4x.1234567"
}
Sample Response
{
"md5": "aa9cd16bbbe3227b5bacfed0c331a006",
"qr": "data:image/png;base64,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"
}
API Method
Endpoint | HTTP Method |
---|---|
BASE_URL/approvedtransactions/generateal |
POST |
Request Body
Parameter | Type | Description |
---|---|---|
storeId |
ObjectId | Merchants store ID |
total |
Float | Total transaction amount |
transactionNumber |
String | Transaction Number |
See sample request and response on the right side.
2. Checkout EmpatKali as payment option
This will open EmpatKali payment portal where users can pay using their EmpatKali account.
Use the base URL below according to the environment you're using.
Sandbox
https://sandbox-portal.empatkali.co.id
Production
https://portal2.empatkali.co.id
Required Query String Parameter
Parameter | Type | Description |
---|---|---|
total | Float | Transactions total amount |
store_id | String | Store Id provided by EmpatKali |
transaction_id | String | Transaction id |
md5 | String | Generated from step #1 |
base_url | String | merchants e-commerce base url ex. www.baseurl.com |
redirect_url | String | URL where the user will be redirected when the transaction was a success |
failed_url | String | URL where the user will be redirected when the transaction failed |
checkout_name | String | Concatenated User's first name and last name inputted during checkout |
checkout_email | String | User's email inputted during checkout |
checkout_shipping_address | String | Concatenated User's address inputted during checkout, i.e. address, country, and alike |
checkout_phone_number (sandbox) | String | User's phone number |
sku_category | String | category |
sku_price | Float | Price |
sku_quantity | Integer | Quantity |
sku_id | String | SKU Id |
sku_product_name | String | Product name |
Example Usage
https://sandbox-portal.empatkali.co.id/index.php?total=100000&store_id=5ef16ac5bc15f2396dd7635b&md5=02be278055aa592a1c1e4a0d195f3c5e&transaction_id=MAPTRX001&redirect_url=https://www.google.com/&base_url=https://www.google.com&failed_url=https://failed.com&checkout_name=Jane%20Doe&[email protected]&checkout_shipping_address=Jakarta&20Indonesia&sku_category=pants&sku_price=1200&&sku_quantity=1&sku_id=a1234&sku_product_name=pants
Sample Response
{
"gross_amount": 344000,
"status_message": "success",
"status_code": 200,
"success": true,
"transaction_number": "PL1234",
"transaction_id": "EMPAT.PL1234"
}
After that, it'll redirect to the specified payment portal which the user will then input their 4x credentials and other necessary steps for payment validation. Everything will be processed until a response is given, determining if the transaction was successful or not. See sample response.
Override Notification URL
Merchant can opt to change or add custom notification urls on every transaction. It can be achieved by adding additional HTTP headers into charge request.
There are two headers we provide:
X-Append-Notification
X-Override-Notification
Both header can only receive up to maximum of 3 urls.
Sample case
Assuming merchant has set https://example.com as their notification url on the dashboard.
If they set X-Append-Notification
with values https://example.com/test1, https://example.com/test2
. Then every HTTP notification for that specific transaction will be sent to:
- https://example.com
- https://example.com/test1, and
- https://example.com/test2
Else if they set X-Override-Notification
with values https://example.com/test1, http://example.com/test2
. Then, every HTTP notification for that specific transaction will be sent to:
- https://example.com/test1 and
- https://example.com/test2
(NEW) Redirect Integration Process
Overview
Flow on how the redirect integration process
(click image to enlarge)
- User transacts to any merchant supported by Empatkali
- Merchant will then send request to Empatkali API to create payment
- Empatkali will send response after processing the create payment request from merchant
- If success, merchant will connect via socket and be process by Empatkali server
- Once processed, Empatkali will send a callback
Implementation
A step-by-step implementation of the NEW redirect integration process.
1. Authenticate
Validate your credentials i.e. store id
and secret key
for authentication. If success, the API will return a redirect_url
response that contains the URL value which will then be used for redirection to the portal.
API Base URL
Sandbox : https://sb-transaction.empatkali.co.id/api
Production : https://transaction.empatkali.co.id/api
API Method
Endpoint | HTTP Method |
---|---|
BASE_URL/generate_authentication |
POST |
Request Header
Use Basic authentication scheme for authorization and use the store id
and the secret key
provided to you by EmpatKali as the username (store id) and password (secret key). For example on how to implement Basic authentication, click this link.
Request Body
Parameter | Type | Description |
---|---|---|
transactionNumber |
String | Transaction Number |
total |
Float | Total transaction amount |
detail |
Object | |
detail.items |
Array | Contains SKU data |
detail.otherFields |
Object |
See sample on the right side regarding the required fields under that parameter.
Sample Request
{
"transactionNumber": "TESTONAL007",
"total": 1000000,
"redirectURL": "https://redirect-after-success.com",
"failedURL": "https://redirect-after-failed.com",
"detail": {
"items": [
{
"sku_id": "sku_id",
"sku_product_name": "sku_product_name",
"sku_category": "sku_category",
"sku_price": "testing",
"sku_quantity": "sku_quantity"
},
{
"sku_id": "sku_id",
"sku_product_name": "sku_product_name",
"sku_category": [
"sku_category",
"sku_category",
"sku_category"
],
"sku_price": "testing",
"sku_quantity": "sku_quantity"
},
{
"sku_id": "sku_id",
"sku_product_name": "sku_product_name",
"sku_category": [
"sku_category",
"sku_category"
],
"sku_price": "testing",
"sku_quantity": "sku_quantity"
}
],
"otherFields": {
"checkout_name": "firstname and last name user",
"checkout_email": "email user on checkout",
"checkout_phone": "123456",
"checkout_shipping_address": {
"street": "Jl. Sultan Sharir",
"number": "666",
"city": "jakarta",
"postal_code": "12210",
"province": "jakarta"
},
"billing_name": "firstname and last name user",
"billing_email": "email user on checkout",
"billing_phone": "123456",
"billing_shipping_address": {
"street": "Jl. Sultan Sharir",
"number": "666",
"city": "jakarta",
"postal_code": "12210",
"province": "jakarta"
}
}
}
}
Sample Response
{
"redirect_url": "https://release-empatkali.co.id/5fd3c2c74c96a68f41d6dcc5/fa1fdbe552c62b16c1c96992150dc894",
"qr": "data:image/png;base64,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"
}
2. Redirection
If verified by our system (Step 1), you will be provided a response from the API, and one of it is the redirect_url
. You may use that response to redirect to EmpatKali portal.
Override Notification URL
Merchant can opt to change or add custom notification urls on every transaction. It can be achieved by adding additional HTTP headers into charge request.
There are two headers we provide:
X-Append-Notification
X-Override-Notification
Both header can only receive up to maximum of 3 urls.
Sample case
Assuming merchant has set https://example.com as their notification url on the dashboard.
If they set X-Append-Notification
with values https://example.com/test1, https://example.com/test2
. Then every HTTP notification for that specific transaction will be sent to:
- https://example.com
- https://example.com/test1, and
- https://example.com/test2
Else if they set X-Override-Notification
with values https://example.com/test1, http://example.com/test2
. Then, every HTTP notification for that specific transaction will be sent to:
- https://example.com/test1 and
- https://example.com/test2
PDP Snippet Custom Merchant
Overview
Integrating EmpatKali PDP (Product Display Page) Snippet for custom website.
For other supported e-commerce platforms:
- WooCommerce
- Shopify
Sample screenshot of how it should look (click image to enlarge)
Implementation
Below are the steps on implementing the PDP
(1) Copy the text
Make sure to copy the provided text below depending on the language you are using. Currently we support 2 versions i.e. Bahasa and English.
English
or 4 interest-free payment of IDR (Amount of item / 4)
with Info
Bahasa
atau 4 kali cicilan 0% Rp (nilai item / 4)
pakai with Info lebih lanjut
For the EmpatKali logo, you may download it here
(2) Popup Content
When "info" is clicked, it should trigger a popup that contains EmpatKali information. You may use vanilla JS or a variety of libraries such as Fancybox for example, or use bootstrap modal. Then inside that modal, just create an iframe and call the URL that contains EmpatKali information (see below for the link) based on the language that you support (Bahasa or English version).
For Bahasa
https://static.empatkali.co.id/info-lebih-lanjut.html
For English
https://static.empatkali.co.id/en/info-lebih-lanjut.html
(3) That's it
WooCommerce Integration
Overview
Install EmpatKali plugin as one of your payment gateway during checkout.
Download the plugin here
https://wordpress.org/plugins/woo-empatkali-checkout-gateway/
Usage
Step By Step
1. After Download and install
2. In side Menu Wordpress choose woocomerce and then click sub menu setting
3. then click payment tab -> enable radio button
4. then click empatkali woocomerce plugin -> input storeId and
secret key ( get from email : Subject create Store )
Follow instructions below on how to setup EmpatKali on WooCommerce.
Enabling the plugin (click image to enlarge)
Setting up the payment gateway
Input the Store Id and Secret Key on the right environment field (click image to enlarge).
Sample transaction using Empatkali payment gateway (click image to enlarge)
```
WooCommerce Product Snippet Integration
Overview
Install Product Snippet which will then display to your single product page.
Installation
- Download the plugin by clicking this link then upload the zip file.
-
Just activate it, no dependencies required, no codes to embed
-
Done!
Shopify
Snippet Integration on Product Page
Copy the codes (Step #1)
<script type="text/javascript">
// Non-editable fields
var empatkali_shop_currency = {{ shop.currency | json }};
var empatkali_shop_money_format = {{ shop.money_format | json }};
var empatkali_shop_permanent_domain = {{ shop.permanent_domain | json }};
var empatkali_theme_name = {{ theme.name | json }};
var empatkali_product = {{ product | json }};
var empatkali_current_variant = {{ product.selected_or_first_available_variant | json }};
var empatkali_cart_total_price = {{ cart.total_price | json }};
var empatkali_js_snippet_version = '1.0.0';
</script>
<script type="text/javascript" src="https://static.empatkali.co.id/shopify-empatkali.js"></script>
The Empatkali logo and instalment amounts will appear on the Shopify Product Pages.
Note: The display may differ depending on site-specific theme and layout.
Configuration
Completing the steps on the right section will position the Empatkali Product Page assets on your Shopify website.
- Copy the codes on the right side.
- Navigate to Shopify Admin.
-
Navigate to: ‘Sales Channels‘ > ‘Online Store‘ > ‘Themes‘.
-
Navigate to ‘Actions’ > ‘Edit Code’.
-
Under the ‘Layout’ folder, click on ‘theme.liquid’.
-
Scroll to the bottom of the ‘theme.liquid’ file.
-
Paste the copied text (Step 1), at the bottom of the ‘theme.liquid’ file.
- Click Save
-
Navigate to the website and review the product page for Empatkali assets.
Example below
Sirclo Integration
Overview
Empatkali payment gateway will allow you to purchase products on your website during checkout
Usage
Step By Step
1. Go to Sirclo Admin Dashboard
2. In side Menu Prestashop choose “Setting”
3. Please Search Empatkali and Check the checkbox to allow user to use Empatkali Payment
4. Then input Store ID and Secret Key (get from email with Subject Create Store)
5. Then Click SAVE
In your Sirclo payment settings, input the required fields such as the idStore and secret key and make sure that it is working. If all is well, then you should see Empatkali as one of your payment gateway during checkout.
See screenshots below
STEP 01 (click image to enlarge)
STEP 02 (click image to enlarge)
PRESTASHOP Integration
Overview
Empatkali payment gateway will allow you to purchase products on your website during checkout
you can find our PRESTASHOP plugin with click here
Usage
Step By Step
1. After download our PRESTASHOP PLUGIN then go to Prestashop Admin
2. In side Menu Prestashop choose “Module and Services”then click submenu “Modul and Service”
3. Then click “Add a New Module”
4. Please upload .zip that downloaded before and click Upload This Module
5. Then in Module and Services Page there several module list, search Empatkali plugin that already uploaded and then click “Configure”
6. Input Store ID and Secret Key (get from email with Subject Create Store)
7. Then Click SAVE
In your PRESTASHOP payment settings, input the required fields such as the idStore and secret key and make sure that it is working. If all is well, then you should see Empatkali as one of your payment gateway during checkout.
See screenshots below
STEP 01 (click image to enlarge)
STEP 02 (click image to enlarge)
STEP 02 (click image to enlarge)
QR Code Integration
Process Flow Diagram
A Process flow diagram on how to integrate qr code to your app
(click image to enlarge)
Below are the snippets and instructions to follow on how to (1) generate qr code which will then be used for (2) socket implementation.
(1) Generate QR
Generate a QR code
Sample Request
{
"storeId": "xxxxxxxxxxxxxxxxx",
"total": "1000000",
"transactionNumber":"AABBCC123456"
// note : aditional parameter
"customField1": xxxxxxxxx,
"customField2": xxxxxxxxx,
"customField3": xxxxxxxxx,
"customField4": xxxxxxxxx,
"customField5": xxxxxxxxx
}
Sample Response
{
"md5": "f9fe0f79ddef11c1590980267662608b",
"qr": "data:image/png;base64,A3lAvp/2dqdlAAAAAElFTkSuQmCC....."
}
Endpoint | HTTP Method |
---|---|
/api/approvedtransactions/generateal |
POST |
Keep the qr
value from the response for creating a transaction.
(2) Socket Implementation
This is the example for how to implement qr code with socket,
HTML [QR CODE PAYMENT SAMPLE PAGE]
<html>
<head>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
}
/* The Modal (background) */
.modal {
display: none;
/* Hidden by default */
position: fixed;
/* Stay in place */
z-index: 1;
/* Sit on top */
padding-top: 100px;
/* Location of the box */
left: 0;
top: 0;
width: 100%;
/* Full width */
height: 100%;
/* Full height */
overflow: auto;
/* Enable scroll if needed */
background-color: rgb(0, 0, 0);
/* Fallback color */
background-color: rgba(0, 0, 0, 0.4);
/* Black w/ opacity */
}
/* Modal Content */
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
/* The Close Button */
.close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
</style>
</head>
<body>
<h2>QR CODE PAYMENT SAMPLE PAGE</h2>
<br><br>
<!-- <button id="myBtn">Open Modal</button> -->
<table>
<tr>
<td>Transaction Number</td>
<td>:</td>
<td><input type="text" name="transactionnumber" value="123123" id="transactionnumber"></td>
</tr>
<tr>
<td>Total</td>
<td>:</td>
<td><input type="number" name="total" value="100000" id="total"></td>
</tr>
<tr>
<td colspan='3'><button onclick="generate()">Generate</button></td>
</tr>
</table>
<br><br><br>
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<center>
<span class="close">×</span>
<p id="free_text"></p>
</center>
</div>
</div>
<div id="transaction-modal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<br><br>
<p><b>Scan this qr code with your EmpatKali mobile apps</b></p>
<center>
<img id="qr" name="qr">
</center>
</div>
</div>
<script type="text/javascript">
var websocket;
var storeId = "__yourstoreId__";
var storeSecret = "__yourstoreSecret__";
var user_mobileNumber = "__userMobileNumber__";
var md5 = "";
// MODAL ASSETS
// Get the modal
var modal = document.getElementById('myModal');
// Get the button that opens the modal
// var btn = document.getElementById("myBtn");
// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];
// When the user clicks the button, open the modal
// btn.onclick = function() {
// modal.style.display = "block";
// }
// When the user clicks on <span> (x), close the modal
span.onclick = function () {
modal.style.display = "none";
}
// When the user clicks anywhere outside of the modal, close it
window.onclick = function (event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
function myFunction() {
/* Get the text field */
var copyText = document.getElementById("token");
/* Select the text field */
copyText.select();
/* Copy the text inside the text field */
document.execCommand("copy");
/* Alert the copied text */
document.getElementById('wording').innerHTML = 'Copied';
document.getElementById('wording').style.color = getRandomColor();
}
function getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
function generate() {
var datas = {
"storeId": storeId,
"secret": storeSecret,
"total": document.getElementById('total').value,
"transactionNumber": document.getElementById('transactionnumber').value
}
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "http://sb-api.empatkali.co.id/merchant/api/approvedtransactions/generateal");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.send(JSON.stringify(datas));
xhttp.onreadystatechange = function () {
if (xhttp.readyState == XMLHttpRequest.DONE) {
var resp = JSON.parse(xhttp.responseText);
md5value = resp.md5;
document.getElementById('qr').src = resp.qr;
document.getElementById('transaction-modal').style.display = "block";
}
}
}
function socketMessageListener(evt) {
// sample: {
// "transaction_number": String,
// "success": Boolean,
// "status_code": String,
// "status_message": String
// }
var message = JSON.parse(evt.data);
switch (message.type) {
case 'validateClient':
/**
* message
* {
* type: 'validateClient',
* store: {id: <String>, secret: <String>}
* clientType: <String Enum['store']>
* }
*/
modal = document.getElementById('transaction-modal');
modal.style.display = "none";
modal = document.getElementById('myModal');
if (message.success) {
document.getElementById('free_text').innerHTML = 'Success connecting';
document.getElementById('free_text').style.color = "green";
} else {
document.getElementById('free_text').innerHTML = 'Failed connecting';
document.getElementById('free_text').style.color = "red";
}
modal.style.display = "block";
break;
case 'paymentPin':
/**
* message
* {
* succes: true,
* type: 'paymentPin',
* detail : {
* expiredIn: tokens.delay,
* otp: tokens.otp
* }
* }
*/
if (message.success && message.type === 'paymentPin') {
document.getElementById('expired').innerHTML = message.detail.expiredIn;
document.getElementById('token').value = message.detail.otp;
// modal.style.display = "block";
}
break;
case 'createPayment':
modal.style.display = "none";
modal = document.getElementById('myModal');
if (message.success) {
document.getElementById('free_text').innerHTML = 'Transaction ' + message.detail.transaction_number + 'Success';
document.getElementById('free_text').style.color = "green";
} else {
document.getElementById('free_text').innerHTML = 'Transaction ' + message.detail.transaction_number + 'Failed';
document.getElementById('free_text').style.color = "red";
}
modal.style.display = "block";
break;
default:
alert(JSON.stringify(message));
}
}
function createTransaction() {
var datas = {
"transactionNumber": document.getElementById('transactionnumber').value,
"amount": parseInt(document.getElementById('total').value),
"user_mobileNumber": user_mobileNumber,
"store": storeId,
"md5": md5value,
"token": document.getElementById('paymentpin').value
}
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "http://sb-api.empatkali.co.id/merchant/api/preapprovedtransactions");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.send(JSON.stringify(datas));
xhttp.onreadystatechange = function () {
if (xhttp.readyState == XMLHttpRequest.DONE) {
var resp = JSON.parse(xhttp.responseText);
if (resp.success && resp.status_code === '200') {
modal.style.display = "none";
modal = document.getElementById('myModal');
document.getElementById('free_text').innerHTML = 'Success creating transaction. now connecting to socket. . .';
document.getElementById('free_text').style.color = "green";
modal.style.display = "block";
if (websocket) console.error('Disconnected.');
var urinya = 'ws://sb-api.empatkali.co.id:4041/ws/approvedtransactions/paymentcode/' + user_mobileNumber;
websocket = new WebSocket(urinya);
websocket.addEventListener('open', socketOpenListener);
// websocket.onmessage = function (evt) { };
websocket.addEventListener('message', socketMessageListener);
} else {
document.getElementById('free_text').innerHTML = 'Failed creating transaction';
document.getElementById('free_text').style.color = "red";
modal.style.display = "block";
}
}
}
}
function socketOpenListener(evt) {
var a = {
type: 'validateClient',
store: {
id: storeId,
secret: storeSecret
},
clientType: 'store'
};
console.log('Connected');
console.log('socket.readyState: ' + websocket.readyState);
return setTimeout(() => websocket.send(JSON.stringify(a)), 1000);
}
</script>
</body>
</html>
Custom Field
Response
{
"storeId": __yourStore_Id__,
"secret": __yourstore_secret__,
"total": 1000000,
"transactionNumber": __yourTransactionID__,
"customField1": xxxxxxxxx,
"customField2": xxxxxxxxx,
"customField3": xxxxxxxxx,
"customField4": xxxxxxxxx,
"customField5": xxxxxxxxx
}
Set Custom Fields is a feature that enables merchants to charge a transaction with a unique data according to the merchant's need. EMPATKALI provides merchants with 5 custom fields that can be used for various utilities. Convention of a custom field can be set when merchant request transaction
JSON Attribute | Type | Description |
---|---|---|
customField1 | String() | The value of custom field 1 |
customField2 | String() | The value of custom field 2 |
customField3 | String() | The value of custom field 3 |
customField4 | String() | The value of custom field 4 |
customField5 | String() | The value of custom field 5 |
Callback
Response
{
"status_message": String
"status_code": String,
"success": Boolean,
"transaction_number": String,
"transaction_id": String,
}
Status Code | Success | Status Message |
---|---|---|
200 | true | Success |
201 | false | OTP not valid |
202 | false | Duplicate Invoice Number |
203 | false | Insufficient Users Balance |
204 | false | MD5 not valid |
205 | false | User is not allowed |
206 | false | Cannot charge the card |
207 | false | User not found |
208 | false | Store not found |
209 | false | Card not found |
210 | false | Unexpected error |
300 | false | Transaction cancelled |
Dependency for testing
This is mobile number of EMPATKALI active user, for mechant doing testing approval transaction
- 0817345545 -- Dana
- 087897971805 -- Card
You can take the payment code on store dashboard with credential we already sent to you after you create the store account on your merchant portal. To do generate payment code you just insert the the mobile number and click generate, the payment code will show to you and can use.
Dashboard on boarding
(1) Merchant Dashboard
Merchant dashboard adalah dashboard yang disediakan oleh Empatkali dimana didalam dashboard ini memuat berbagai informasi mengenai suatu merchant yang sudah terintegrasi dengan menggunakan EMPATKALI, seperti informasi untuk seluruh sales order di semua store yang dimiliki oleh merchant,store yang dimiliki merchant, detail dari merchant dll. Merchant Dashboard ini dapat diakses di url https://merchant.empatkali.co.id Untuk dapat masuk ke merchant dashboard diperlukan Login dengan menggunakan username atau alamat email dan juga password. Merchant Dashboard
Homepage Merchant Dashboard -> Choose Account Setting menu
Klik Edit -> Input Nama Merchant , Nama Penanggung Jawab, No Telp, Alamat email, Aamat website. **for field Fav Icon and image will provide by us -> Save
Then in menu store -> Klik ADD
Then Input field Nama, Email, Username No Telp(Mobile), Type store (Online atau Offline) dan password -> ADD
(2) Store Dashboard
Store Dashboard link here.
Homepage Merchant Dashboard -> Choose Account Setting menu
Klik Edit -> Input Nama Merchant , Nama Penanggung Jawab, No Telp, Alamat email, Aamat website. **for field Fav Icon and image will provide by us -> Save