NAV

Mobile - Mobile Web to App

Overview Demo API

INTEGRATION STEPS#

  1. End-users select ZaloPay Payment method on the Merchant's Mobile Web.
  2. Merchant send a request to create order to ZaloPay. ZaloPay returns the order information to Merchant side.
  3. Merchant's Web ask user to launch the ZaloPay app to perform payment steps.
  4. Merchant server should  query for order's status  when haven't received ZaloPay's callback yet
  5. Merchant needs to handle  callback  from ZaloPay when End-User pay success.
  6. If payment complete, ZaloPay will relaunch the Merchant's Mobile Web to display the transaction results.

Description#

When user buy goods on the Merchant App and choose ZaloPay Payment method, Merchant's Website will direct users to ZaloPay app to processing payment through Mobile Web to App method. When users have done with payment processing, ZaloPay app will let Merchant server know the final result.

Processing flow#

* NOTE
Giá trị Ghi chú
MerchantSite Merchant's web/app.
MerchantServer Merchant's back-end.
ZaloPayServer ZaloPay's back-end.
ZaloPaySite ZaloPay's web/app.

Sequence Flow

API specification#

When the Merchant server send a request to create order to ZaloPay server, ZaloPay server will response a redirect link in the orderurl field to Merchant side.

Example:

{
  "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.zalopay0203001010627000503173916458628013369138620010A00000072701320006970454011899ZP23237O000015410208QRIBFTTA5204739953037045405690005802VN622108173916458628013369163043895"
}

When users do a payment processing, merchant website call the redirect link like below to direct users to ZaloPay Payment site.

Redirect link (orderurl value) is the link for ZaloPay App do a payment process purpose.

Redirect#

After the user has finished paying, they will be redirected to the Merchant page (according to RedirectURL Merchant provided to ZaloPay) to display the results.

The query string data when ZaloPay redirect to the Merchant page#

Parameter Datatype Description
appid int appid of order
apptransid String apptransid of order
pmcid int Payment channel
bankcode String Bank code
amount long Amount of order (VND)
discountamount long Discount (VND)
status int Error code
checksum String Use to check redirect is valid or not
HMAC(hmac_algorithm, key2, appid +"|"+ apptransid +"|"+ pmcid +"|"+ bankcode +"|"+ amount +"|"+ discountamount +"|"+ status)

Sample code#

/*
    ASP.Net core
*/
using Microsoft.AspNetCore.Mvc;
using ZaloPay.Helper; // HmacHelper, RSAHelper, HttpHelper, Utils (download at DOWNLOADS page)
using ZaloPay.Helper.Crypto;

namespace ZaloPayExample.Controllers
{
    [Route("[controller]")]
    [ApiController]
    public class RedirectController: ControllerBase
    {
        private string key2 = "Iyz2habzyr7AG8SgvoBCbKwKi3UzlLi3";

        [HttpGet]
        public IActionResult Get()
        {
            var data = Request.Query;
            var checksumData = data["appid"] +"|"+ data["apptransid"] +"|"+ data["pmcid"] +"|"+ 
                data["bankcode"] +"|"+ data["amount"] +"|"+ data["discountamount"] +"|"+ data["status"]; 
            var checksum = HmacHelper.Compute(ZaloPayHMAC.HMACSHA256, key2, checksumData);

            if (!checksum.Equals(data["checksum"])) {
                return StatusCode(400, "Bad Request");
            }
            else {
                // check if the callback has been received, if not Merchant should use getOrderStatus API to get final result
                return StatusCode(200, "OK");
            }
        }
    }
}
No matching results were found