Select the appropriate model of ZaloPay integration
CHECKLIST CÁC BƯỚC TÍCH HỢP
Step 1: Select payment model
Step 2: Send a request to create order
Step 3: Checking order status
Step 4: Request to ZaloPay Gateway
Step 5: CallBack from ZaloPay Server
-
-
-
-
When End-user pays the order, the Merchant Client's interface adds payment models which ZaloPay wallet, Visa/Master/JCB card, ATM card, following ways:
Download:
Download source HTML (way 1)
Download source HTML (way 2)
Following, End-user click "Payment" to send a request to create order (step 2)
After End-user click "Payment", Merchant Site sends a request to create order (createOrder) to Merchant Server.
Merchant Server call createOrder API of ZaloPay Server.
API: Create order (createOrder)
Note: Use the correct bankcode parameter in createOrder API, corresponding to each form of payment model
bankcode | Results are displayed on the ZaloPay Gateway page |
---|---|
Empty ("" ) (*) |
List of payment methods and banks supported (CC , ATM , zalopayapp , ...) |
zalopayapp |
QR code to scan with ZaloPay App |
CC |
Form to input credit card information |
ATM bank code (VTB , VCB , ...) |
Form to input bank card information |
bank_code | preferred_payment_method | Nội dung truyền thông tin | Kết quả hiển thị trên trang cổng thanh toán |
---|---|---|---|
Rỗng ("") | [] | "bank_code": "", "embed_data": { "preferred_payment_method": [] } |
Danh sách tất cả các hình thức và ngân hàng được hỗ trợ (ATM, CC, ZaloPay, ZaloPay QR đa năng, Apple Pay ...) |
Rỗng ("") | [“domestic_card”, “account”] | "bank_code": "", "embed_data": { "preferred_payment_method": [“domestic_card”, “account”] } |
Danh sách tất cả Ngân hàng hỗ trợ, người dùng chọn và nhập thông tin thẻ ATM hoặc tài khoản Ngân hàng tương ứng |
Rỗng ("") | [“zalopay_wallet”] | "bank_code": "", "embed_data": { "preferred_payment_method": [“zalopay_wallet”] } |
Hiển thị ZaloPay QR code để thanh toán bằng Zalo/ZaloPay |
Rỗng ("") | [“vietqr”] | "bank_code": "", "embed_data": { "preferred_payment_method": [“vietqr”] } |
Hiển thị ZaloPay QR đa năng để thanh toán bằng các ứng dụng Ngân hàng và Zalo/ZaloPay |
Rỗng ("") | [“international_card”] | "bank_code": "", "embed_data": { "preferred_payment_method": [“international_card”] } |
Form hiển thị cho việc nhập thông tin thẻ tín dụng |
Rỗng ("") | [“applepay”] | "bank_code": "", "embed_data": { "preferred_payment_method": [“applepay”] } |
Form hiển thị cho việc chọn phương thức Apple Pay |
Mã ngân hàng ATM (VTB, VCB, ...) | [] | "bank_code": "specific bankcode", "embed_data": { "preferred_payment_method": [] } |
Form nhập thông tin thẻ của ngân hàng tương ứng Merchant sử dụng API Getlistmerchantbanks để lấy giá trị specific bankcode |
After 15 minutes in step 2 (transaction's timeout is 15 minutes), if callback information has not been received, the Merchant Server sends a request to ZaloPay Server to get order's status.
{:API=>"Get order's status"}
Note:
- API getstatusbyapptransid is only valid for 48 hours since ZaloPay Server accept the order.
- API getstatusbyapptransid can only be used after the Merchant system receives a callback or redirect or 16 minutes after creating order.
Next, Merchant Site redirects to the ZaloPay Gateway, End-users process payment steps.
When Merchant Server sends a request to create order to ZaloPay Server (in step 2), ZaloPay server will response a redirect link in the orderurl field, Merchant uses orderurl to redirect users to ZaloPay Payment site
{
"returncode": 1,
"returnmessage": "Thành công",
"orderurl":"https://qcgateway.zalopay.vn/openinapp?order=eyJ6cHRyYW5zdG9rZW4iOiJ4dGd1SEs1YnU0VDJkSHE3TUFwTFFnIiwiYXBwaWQiOjN9"
}
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
- After End-user pays, ZaloPay Server will response the transaction status to ZaloPay Gateway.
- ZaloPay Gateway redirects to Merchant Site to display transaction results on the interface.
API: redirect