Skip to main content

Payment Page Integration

If you are non PCI DSS compliance, you can use this type of integration to ensure that the credit card data of the customer is securely process by DOKU.


Integration steps

Here is the overview of how to integrate with Credit Card channel:

  1. Generate payment URL (credit card payment page)
  2. Display payment URL (credit card payment page)
  3. Create test payment
  4. Acknowledge payment result
DOKU Direct - Credit Card Sequence Diagram
DOKU Direct Credit Card Merchant Flow

1. Generate payment URL (credit card payment page)

To generate payment URL, you will need to hit this API through your backend:

API Request

TypeValue
HTTP MethodPOST
API endpoint (Sandbox)https://api-sandbox.doku.com/credit-card/v1/payment-page
API endpoint (Production)https://api.doku.com/credit-card/v1/payment-page

Here is the sample of request header to generate payment URL:

Client-Id: MCH-0001-10791114622547
Request-Id: b266c265-3d61-4708-9860-c0d5b9a98f8c
Request-Timestamp: 2020-08-11T08:45:42Z
Signature: HMACSHA256=9UPUFzOqJc47aJzD9ESOTcWg6TMsg3mqSP+DnUO8ENE=
Request Header Explanation
ParameterDescription
Client-IdClient ID retrieved from DOKU Back Office
Request-IdUnique random string (max 128 characters) generated from merchant side to protect duplicate request
Request-TimestampTimestamp request on UTC time in ISO8601 UTC+0 format. It means to proceed transaction on UTC+7 (WIB), merchant need to subtract time with 7. Ex: to proceed transaction on September 22th 2020 at 08:51:00 WIB, the timestamp should be 2020-09-22T01:51:00Z
SignatureSecurity parameter that needs to be generated on merchant Backend and placed to the header request to ensure that the request is coming from valid merchant. Please refer to this section to generate the signature

Here is the sample request body to generate payment URL:

{
"order": {
"invoice_number": "INV-20210118-0001",
"amount": 90000,
"line_items": [
{
"name": "T-Shirt Red",
"price": 30000,
"quantity": 2
},
{
"name": "Polo Navy",
"price": 30000,
"quantity": 1
}
],
"callback_url": "https://merchant.com/success-url",
"failed_url": "https://merchant.com/failed-url",
"auto_redirect": false
},
"card": {
"token": "a55b8d8df709607d2a343778898f41d0",
"save": false
},
"customer": {
"id": "CUST-0001",
"name": "Anton Budiman",
"email": "anton@example.com",
"phone": "6285694566147",
"address": "Menara Mulia Lantai 8",
"country": "ID"
},
"payment": {
"type": "INSTALLMENT",
"acquirer":"BRI",
"tenor": 3
},
"override_configuration": {
"themes": {
"language": "EN",
"background_color": "F5F8FB",
"font_color": "1A1A1A",
"button_background_color": "E1251B",
"button_font_color": "FFFFFF"
},
"promo": [
{
"bin": "142498",
"discount_amount": 20000
},
{
"bin": "314498",
"discount_amount": 20000
},
{
"bin": "091234",
"discount_amount": 10000
},
{
"bin": "091234",
"discount_amount": 10000
}
],
"allow_bin": ["461700","410505","557338"],
"allow_tenor": [0,3,6]
},
"additional_info": {
"override_notification_url": "https://google.com",
"disclaimer" : {
"id" : "Testing",
"en" : "testing englis"
}
}
Request Body Explanation
ParameterTypeMandatoryDescription
order.amountnumberMandatoryIn IDR Currency and without decimal
Allowed chars: numeric
Max length: 12
order.invoice_numberstringMandatoryGenerated by merchant to identify the order
Allowed chars: alphabetic, numeric, special chars
Max length: 64
order.callback_urlstringConditionalMerchant URL that will redirected to after the order success. Mandatory if merchant set order.auto_redirect to true
Allowed chars: alphabetic, numeric, special chars
order.failed_urlstringOptionalMerchant URL that will redirected to after the order failed. If not set, then will redirect to callback_url
Allowed chars: alphabetic, numeric, special chars
order.auto_redirectstringMandatoryRedirection to defined callback_url after payment process completed
Possible value: true, false
Default value: false
order.line_items.namestringOptionalName of the product item
Allowed chars: alphabetic, numeric, special chars
Max Length: 255
order.line_items.pricenumberOptionalPrice of the product item. Total price and quantity must match with the order.amount
Allowed chars: numeric
Max Length: 12
order.line_items.quantitynumberOptionalQuantity of the product item
Allowed chars: numeric
Max Length: 4
card.tokenstringOptionalCard token generated by DOKU. If you sent this, then the customer credit card will be pre-filled.
Allowed chars: alphabetic, numeric
Max Length: 32
card.savebooleanOptionalSet true if you want to force customer to save the card token for the next payment
Possible value: true, false
Default value: false
customer.idstringConditionalUnique customer identifier generated by merchant. Mandatory if merchant wants to use tokenization feature.
Allowed chars: alphabetic, numeric, special chars
Max Length: 50
customer.namestringOptionalCustomer name
Allowed chars: alphabetic
Max Length: 255
customer.emailstringConditionalCustomer email.
Mandatory if customer phone value blank.
Allowed chars: alphabetic, numeric, special chars
Max Length: 128
customer.phonestringConditionalCustomer phone number. Format: {calling_code}{phone_number}. Example: 6281122334455.
Mandatory if customer email value blank.
One of them must be filled in between customer email and customer phone
Allowed chars: numeric
Max Length: 16
customer.addressstringOptionalCustomer address
Allowed chars: alphabetic, numeric, special chars
Max Length: 400
customer.countrystringOptional2 alphabetic country code ISO 3166-1
Allowed chars: alphabetic
Min-max Length: 2
override_configuration.themes.
language
stringOptionalDefault language that will be displayed on the Payment Page
Possible value: English EN, Indonesia ID
Default: English EN
override_configuration.themes.
background_color
stringOptionalHEX color code for the payment page background color. Example: FFFFFF
Default: Light gray F5F8FB
override_configuration.themes.
font_color
stringOptionalHEX color code for the payment page font color. Example: 000000
Default: Soft black 1A1A1A
override_configuration.themes.
button_background_color
stringOptionalHEX color code for the payment page button background color. Example: 000000
Default: Red E1251B
override_configuration.themes.
button_font_color
stringOptionalHEX color code for the payment page button font color. Example: FFFFFF
Default: White FFFFFF
override_configuration.promo[].
bin
stringOptionalBIN that will get the promo
override_configuration.promo[].
discount_amount
numberOptionalPromo Discount if BIN input matched
(final amount = order.amount - override_configuration.promo[].discount_amount)
override_configuration.allow_binnumberOptionalTransaction only accept BIN listed here
override_configuration.allow_tenornumberOptionalTransaction only accept installment tenor listed here
additionalinfo.override_notification_urlstringOptionalIf you wish to use different notification url instead of the one configured in configuration page, bring this value
additionalinfo.disclaimerobjectOptionalBring this if you want to customer to opt-in payment disclaimer
additionalinfo.disclaimer.idobjectOptionaldisclaimer message in Indonesian
additionalinfo.disclaimer.enobjectOptionaldisclaimer message in English(default)
payment.typestringConditionalBring this if you have more than 1 type of credit card payment type to specify how you want this transaction to be processed (Possible Values : INSTALLMENT, AUTHORIZE, SALE)
payment.acquirerstringConditionalBecomes mandatory if transaction type is INSTALLMENT, to specify to which acquirer you want this transaction to be processed to (Possible Values: BNI, BRI, BANK_CIMB, BANK_MANDIRI, BCA)
payment.tenornumberConditionalBecomes mandatory if transaction type is INSTALLMENT, to specify which tenor you want this transaction to be processed with

API Response

After hitting the above API request, DOKU will give the response.

TypeValue
HTTP Status200
ResultSUCCESS

Here is the sample response header:

Client-Id: MCH-0001-10791114622547
Request-Id: b266c265-3d61-4708-9860-c0d5b9a98f8c
Response-Timestamp: 2020-08-11T08:45:42Z
Signature: HMACSHA256=1jap2tpgvWt83tG4J7IhEwUrwmMt71OaIk0oL0e6sPM=
Response Header Explanation
ParameterDescription
Client-IdSame as the request
Request-IdSame as the request
Response-TimestampTimestamp Response on UTC with format ISO8601 UTC+0 from DOKU
SignatureSignature generated by DOKU based on the response body

Here is the sample of response body:

{
"order": {
"invoice_number": "INV-20210118-0001",
"line_items": [
{
"name": "T-Shirt Red",
"price": 30000,
"quantity": 2
},
{
"name": "Polo Navy",
"price": 30000,
"quantity": 1
}
],
"session_id": "0000231223"
},
"credit_card_payment_page": {
"url": "https://sandbox.doku.com/wt-frontend-transaction/dynamic-payment-page?signature=OVVQVUZ6T3FKYzQ3YUp6RDlFU09UY1dnNlRNc2czbXFTUCtEblVPOEVORT0=&clientId=MCH-0001-10791114622547&invoiceNumber=INV-20210118-0001&requestId=8quQyK39l4aM5cCml0Yy"
}
}
Response Body Explanation
ParameterTypeMandatoryDescription
order.invoice_numberstringMandatorySame as the request
order.line_items.namestringOptionalSame as the request
order.line_items.pricenumberOptionalSame as the request
order.line_items.quantitynumberOptionalSame as the request
order.session_idnumberOptionalTransaction session id
credit_card_payment_page.urlstringMandatoryCredit Card Payment Page URL generated by DOKU that merchant displays to the customer
info

DOKU provide risk assesment for Credit Card transaction, your customer data sent to us will help manage your risk of every transaction.


2. Display payment URL (credit card payment page)

You can display payment URL as an iFrame or as a dedicated page to your customer by using credit_card_payment_page.url that you retrieved from API Response. Here is the sample of Credit Card on the iFrame:

DOKU Direct Credit Card Payment Page

3. Creating Test Payment

You can try the payment with various credit card listed here:


4. Acknowledge payment result

After the payment is being made by your customer, DOKU will send HTTP Notification to your defined Notification URL. Learn how to handle the notification from DOKU:


Additional features

We provide various additional features to suited your needs. Learn more here.

Authorize-Capture

After you get the payment.authorize_id, then your backend must trigger the API Charge to DOKU:

API Request

TypeValue
HTTP MethodPOST
API endpoint (Sandbox)https://api-sandbox.doku.com/credit-card/capture
API endpoint (Production)https://api.doku.com/credit-card/capture

Here is the sample of request header to capture the transaction:

Client-Id: MCH-0001-10791114622547
Request-Id: 071a6a32-6785-4011-833d-d2c2049cf744
Request-Timestamp: 2021-08-24T08:46:42Z
Signature: HMACSHA256=9UPUFzOqJc47aJzD9ESOTcWg6TMsg3mqSP+DnUO8ENE=
Request Header Explanation
ParameterDescription
Client-IdClient ID retrieved from DOKU Back Office
Request-IdUnique random string (max 128 characters) generated from merchant side to protect duplicate request
Request-TimestampTimestamp request on UTC time in ISO8601 UTC+0 format. It means to proceed transaction on UTC+7 (WIB), merchant need to subtract time with 7. Ex: to proceed transaction on September 22th 2020 at 08:51:00 WIB, the timestamp should be 2020-09-22T01:51:00Z
SignatureSecurity parameter that needs to be generated on merchant Backend and placed to the header request to ensure that the request is coming from valid merchant. Please refer to this section to generate the signature

Here is the sample request body to capture the transaction:

{
"payment": {
"authorize_id": "12312391719112",
"capture_amount": 90000
}
}
Request Body Explanation
ParameterTypeMandatoryDescription
payment.authorize_idstringMandatoryAuthorize ID from the Charge API Response / HTTP Notification
payment.capture_amountstringOptionalThe value of transactions which will be paid by the customer. If undefined, capture full transaction.

API Response

After hitting the above API request, DOKU will give the response.

TypeValue
HTTP Status200
ResultSUCCESS

Here is the sample response header:

Client-Id: MCH-0001-10791114622547
Request-Id: b266c265-3d61-4708-9860-c0d5b9a98f8c
Response-Timestamp: 2020-08-11T08:45:42Z
Signature: HMACSHA256=1jap2tpgvWt83tG4J7IhEwUrwmMt71OaIk0oL0e6sPM=
Response Header Explanation
ParameterDescription
Client-IdSame as the request
Request-IdSame as the request
Response-TimestampTimestamp Response on UTC with format ISO8601 UTC+0 from DOKU
SignatureSignature generated by DOKU based on the response body

Here is the sample of response body:

{
"order": {
"invoice_number": "INV-20210118-0001",
"amount": 90000
},
"customer": {
"id": "CUST-0001"
},
"payment": {
"type": "CAPTURE",
"identifier": [
{
"name": "Acquirer",
"value": "Mandiri"
},
{
"name": "MID",
"value": "71003372992"
},
{
"name": "TID",
"value": "73120903"
}
],
"request_id": "20201026193843836",
"authorize_id": "12312391719112",
"response_code": "01",
"response_message": "sukses transaksi",
"eci": "",
"status": "SUCCESS",
"approval_code": "123123"
},
"three_dsecure": {
"authentication_id": "eb7e72313b491cd73ea10c6354bc96900f08b3e50e66cf3df2fe29580d6ff84e"
},
"card": {
"masked": "557338*******101",
"type": "CREDIT",
"issuer": "Bank Mandiri",
"brand": "MASTER",
"token": "243591d7e49f45109961581718c3ef82"
}
}
Response Body Explanation
ParameterTypeMandatoryDescription
`order.invoice_numberstringMandatorySame as the request
order.amountnumberMandatorySame as the request
customer.idstringOptionalSame as the request
payment.typestringMandatorySame as the request
payment.identifier.namestringMandatoryAdditional payment info name
payment.identifier.valuestringMandatoryAdditional payment info value
payment.request_idstringMandatoryRequest ID sent on merchant's request header
payment.authorize_idstringMandatoryAuthorize ID for authorize transaction. Mandatory if payment.type is AUTHORIZE
payment.response_codestringMandatoryReponse code generated by DOKU / Acquirer
payment.response_messagestringMandatoryResponse message generated by DOKU / Acquirer
payment.statusstringMandatoryPayment status
Possible value: SUCCESS, FAILED, PENDING
payment.ecistringMandatoryECI for this transaction
payment.approval_codestringOptionalApproval code for success transaction generated by acquirer
three_dsecure.authentication_idstringMandatorySame as the request
card.maskedstringOptionalCard masked number
card.typestringMandatoryCard type
Possible value: CREDIT, DEBIT
card.issuerstringMandatoryCard issuer
card.brandstringMandatoryPrincipal brand
VISA, MASTER, JCB, AMEX
card.tokenstringOptionalCard token generated by DOKU if card.save is true

Online Refund

You can request void or refund using this API.

Requirements
  1. If you are using Credit Card Aggregator service, you can process Void or Refund.
  2. If you are using Credit Card Direct service, please consult with your acquiring bank to learn more whether your credential (MID) supports refund or not.

To request a refund, you will need to hit this API through your backend:

API Request

TypeValue
HTTP MethodPOST
API endpoint (Sandbox)https://api-sandbox.doku.com/cancellation/credit-card/refund
API endpoint (Production)https://api.doku.com/cancellation/credit-card/refund

Here is the sample of request header to generate payment URL:

Client-Id: MCH-0001-10791114622547
Request-Id: 6cc9f8b1-d83d-4c24-b853-a3223f43a744
Request-Timestamp: 2020-08-12T09:45:42Z
Signature: HMACSHA256=9UPUFzOqJc47aJzD9ESOTcWg6TMsg3mqSP+DnUO8ENE=
Request Header Explanation
ParameterDescription
Client-IdClient ID retrieved from DOKU Back Office
Request-IdUnique random string (max 128 characters) generated from merchant side to protect duplicate request
Request-TimestampTimestamp request on UTC time in ISO8601 UTC+0 format. It means to proceed transaction on UTC+7 (WIB), merchant need to subtract time with 7. Ex: to proceed transaction on September 22th 2020 at 08:51:00 WIB, the timestamp should be 2020-09-22T01:51:00Z
SignatureSecurity parameter that needs to be generated on merchant Backend and placed to the header request to ensure that the request is coming from valid merchant. Please refer to this section to generate the signature

Here is the sample request body to request a refund:

{
"order": {
"invoice_number": "INV-20210118-0001"
},
"payment": {
"original_request_id": "b266c265-3d61-4708-9860-c0d5b9a98f8c"
},
"refund": {
"amount": 90000
}
}
Request Body Explanation
ParameterTypeMandatoryDescription
order.invoice_numberstringMandatoryInvoice number of the transaction that being refunded
payment.original_request_idstringMandatoryRequest ID from payment initiation of the transaction that being refunded
refund.amountnumberMandatoryTransaction amount that wants to be refunded

API Response

After hitting the above API request, DOKU will give the response.

TypeValue
HTTP Status200
ResultSUCCESS

Here is the sample response header:

Client-Id: MCH-0001-10791114622547
Request-Id: 6cc9f8b1-d83d-4c24-b853-a3223f43a744
Response-Timestamp: 2020-08-11T08:45:42Z
Signature: HMACSHA256=1jap2tpgvWt83tG4J7IhEwUrwmMt71OaIk0oL0e6sPM=
Response Header Explanation
ParameterDescription
Client-IdSame as the request
Request-IdSame as the request
Response-TimestampTimestamp Response on UTC with format ISO8601 UTC+0 from DOKU
SignatureSignature generated by DOKU based on the response body

Here is the sample of response body:

{
"order": {
"invoice_number": "INV-20210118-0001"
},
"payment": {
"original_request_id": "b266c265-3d61-4708-9860-c0d5b9a98f8c"
},
"refund": {
"amount": 90000,
"type": "FULL_REFUND",
"status": "SUCCESS",
"message": "Approved",
"approval_code": "12321"
}
}
Response Body Explanation
ParameterTypeMandatoryDescription
order.invoice_numberstringMandatorySame as the request
payment.original_request_idstringMandatorySame as the request
refund.amountnumberMandatorySame as the request
refund.typestringMandatoryRefund type based on the transaction
Possible value: VOID, PARTIAL_REFUND, FULL_REFUND
refund.statusstringMandatoryRefund status
Possible value: SUCCESS, FAILED
refund.messagestringOptionalRefund message description
refund.approval_codestringOptionalAcquiring approval code for the refund transaction if the refund.status = SUCCESS
List Of Error Code
APIError messageError CodeHTTP Status CodeExplanation
RefundInvalid Client-Idinvalid_client_id400Invalid Client ID
RefundHeader Client-Id is requiredinvalid_header_request400empty client id
RefundInvalid Header Signatureinvalid_signature400Payment charge with invalid signature
RefundNo Original Transaction AvailableTRANSACTION_NOT_FOUND400Invalid original request id, invoice number
RefundVoid Transaction Must Be Full AmountPAYMENT_FAILED400partial void
RefundTotal Refund amount is Bigger than Original TransactionPAYMENT_FAILED 400refund bigger than original transaction
Refund Type
  • VOID: If the funds has not settled to your bank account. The refund.amount must equal to order.amount, otherwise will fail
  • PARTIAL_REFUND: If the funds has settled to your bank account, and the refund.amount is less than order.amount
  • FULL_REFUND: If the funds has settled to your bank account, and the refund.amount is equal to order.amount

Installment

DOKU Direct Installment Configuration
Installment on us

BCA, Bank Mandiri, BNI only allows for on us installment. You must request MID installment from each respective acquirers.

If you have MID installment from BRI, you can also configure it here.

You can activate installment features on Credit Card Configuration Page to let your customers pay in terms, you will receive full payment ahead and issuer Bank will charge the customer each month depending on tenor and amount of the transaction.

There are minimal transactions amount for each installment (depending on the issuer) and you can see the details in the installment configuration page.

Testing Installment Payment

If you wish to try installment, make sure that you specific bank dummy credit card presented here and make sure that your transaction amount is equal to more than the minimum transaction required


Tokenization

Want to make your checkout experience faster? You can combine this integration with the Tokenization, so the next time your customer purchase, they don't need to input the credit card anymore.

Unbind Token

If you want to unbind the token, you can use the delete tokenization API below :

API Request

TypeValue
HTTP MethodPOST
API endpoint (Sandbox)https://api-sandbox.doku.com/credit-card/delete-tokenization
API endpoint (Production)https://api.doku.com/credit-card/delete-tokenization

Here is the sample of request header to capture the transaction:

Client-Id: MCH-0001-10791114622547
Request-Id: 071a6a32-6785-4011-833d-d2c2049cf744
Request-Timestamp: 2021-08-24T08:46:42Z
Signature: HMACSHA256=9UPUFzOqJc47aJzD9ESOTcWg6TMsg3mqSP+DnUO8ENE=
Request Header Explanation
ParameterDescription
Client-IdClient ID retrieved from DOKU Back Office
Request-IdUnique random string (max 128 characters) generated from merchant side to protect duplicate request
Request-TimestampTimestamp request on UTC time in ISO8601 UTC+0 format. It means to proceed transaction on UTC+7 (WIB), merchant need to subtract time with 7. Ex: to proceed transaction on September 22th 2020 at 08:51:00 WIB, the timestamp should be 2020-09-22T01:51:00Z
SignatureSecurity parameter that needs to be generated on merchant Backend and placed to the header request to ensure that the request is coming from valid merchant. Please refer to this section to generate the signature

Here is the sample request body to unbind the token:

{
"token_id": "0d97e7860952b5b99c63aaed06ca945620f4787d8b07a750a83dffb3413bf16a",
"customer_id": "000000001"
}
Request Body Explanation
ParameterTypeMandatoryDescription
token_idstringMandatoryToken ID that want to unbind or delete
customer_idstringOptionalThe value of Customer ID from API Tokenization

API Response

After hitting the above API request, DOKU will give the response.

TypeValue
HTTP Status200
ResultSUCCESS

Here is the sample response header:

Client-Id: MCH-0001-10791114622547
Request-Id: b266c265-3d61-4708-9860-c0d5b9a98f8c
Response-Timestamp: 2020-08-11T08:45:42Z
Signature: HMACSHA256=1jap2tpgvWt83tG4J7IhEwUrwmMt71OaIk0oL0e6sPM=
Response Header Explanation
ParameterDescription
Client-IdSame as the request
Request-IdSame as the request
Response-TimestampTimestamp Response on UTC with format ISO8601 UTC+0 from DOKU
SignatureSignature generated by DOKU based on the response body

Here is the sample of response body:

{
"status": "DELETE SUCCESS"
}
Response Body Explanation
ParameterTypeMandatoryDescription
statusstringMandatoryDelete Process Status
Possible Value: DELETE SUCCESS or DELETE FAILED
info

To make sure the token already unbinded, you can hit API Get token List.


Split Settlement

If you are a platform or a marketplace, you can use this feature to settle the funds to your sellers or partners programmatically, save many operational efforts.


What's next?

Make a test payment in the Sandbox environment using the dummy credit card that we have prepared to ensure that your application has been successfully integrated.