NAV

Website - Web to App

Overview Integration steps Demo API

INTEGRATION GUIDE

PROCESSING FLOW
* NOTE

- MerchantClient: Merchant's web/app.
- MerchantServer: Merchant's back-end.
- ZaloPayGateway: ZaloPay Gateway's website.
- ZaloPayServer: ZaloPay's back-end.

center my-5 maxw-80

1. Select payment model

When End-user pays the order, the Merchant Client's interface adds a payment model which ZaloPay wallet, following rules:

Download:

Download source HTML

Following, End-user click "Payment" to send a request to create order (step 2)

2. Send a request to create order

- After End-user click "Payment", Merchant Client sends a request to create order to Merchant Server.

- Merchant Server call createOrder API of ZaloPay Server.

API: Create order

{
  "return_code": 1,
  "return_message": "Giao dịch thành công",
  "sub_return_code": 1,
  "sub_return_message": "Giao dịch thành công",
  "zp_trans_token": "AC-YGb2kvGFAmLzTmQD-PdjA",
  "order_url": "https://qcgateway.zalopay.vn/openinapp?order=eyJ6cHRyYW5zdG9rZW4iOiJBQy1ZR2Iya3ZHRkFtTHpUbVFELVBkakEiLCJhcHBpZCI6MjAwMDAwfQ==",
  "order_token": "AC-YGb2kvGFAmLzTmQD-PdjA",
  "qr_code": "00020101021226520010vn.zalopay0203001010627000503173916470299922540338620010A00000072701320006970454011899ZP23240O000026840208QRIBFTTA5204739953037045405690005802VN622108173916470299922540363044082"
}

3. Generate Order's QR Code

Merchant Server sends a request to create order to ZaloPay Server (step 2), ZaloPay Server will response results for Merchant Server, which includes order_url. Merchant Server responses the results to Merchant Client, Merchant Client will use order_url to generate QR code.

Merchant Client will display the QR code as follows:

Download:

Download QRCode on website

4. Checking order's status

After successfully chaged, ZaloPay will notifi to Merchant Server (`notify(callback)` will call only when the transaction is success). However, the notify may miss due to Network issues/Service Unavailable/..., to provide best customers experience, Merchant should query for the orders status with a frequency of every 1 minute til callback is received or run out of orders time

API Get order's status

5. CallBack from ZaloPay Server

After End-user completes the payment steps on ZaloPay Gateway, if ZaloPay successfully get money from user, then ZaloPay Server will callback (callback/notify) to Merchant Server by CallbackURL which had been registered with ZaloPay

API: callback

6. Merchant Client displays payment result

After displaying QR for ZaloPay user (step 3), there will be the following cases:
1. End-user completes the payment, ZaloPay Server will callback to Merchant Server. Merchant Server will notify to Merchant Client to display results.
2. Merchant Server does not receive a callback from ZaloPay Server (because End-User does not pay, or network problems), Merchant Server uses order status in step 4 to notify Merchant Client to display the results.

No matching results were found