ShopeePay & QRIS

ShopeePay is an e-Wallet payment method by Shopee. Users will pay using the Shopee app.

The user flow varies when using a Web Browser (on a computer) compared to a SmartPhone.

By default, Shopeepay JumpApp and QRIS's transaction expiry is 5 minutes (min 20s, max 5 days).

📘

UI Mode

We will show either QRIS or Deeplink based on customer's screen size (wide screen will get QRIS, while small screen will get deeplink). Merchant can however specify whether Shopeepay will be shown in deeplink or QR format persistently using options.uiMode in Snap JS. UI Mode is specified to auto by default.

This guide will assume that the value of uiMode in Snap.JS options is auto, the recommended value.

When users make a purchase using ShopeePay on a Web Browser(on a computer)

1. Users see a QR code on their Web Browser
2. Users open the Shopee app on their phone
3. Users tap the Scan function on the Shopee app

4. Users point their camera to the QR Code.

5. Users check their payment details on the Shopee app and then tap Lanjutkan. Then Bayar Sekarang

6. Waiting until the transaction is complete and the users' ShopeePay balance is deducted

7. Midtrans will mark the payment_type of the transaction as qris. This will also impact the following:

• The JSON fields format (returned on Webhook/HTTP Notifications & Get Status API response) is "payment_type": "qris"

• The Payment Type displayed on Midtrans Dashboard, and when you download transactions.

Detailed payment Flow for ShopeePay on a Desktop PC/Laptop

This is the payment flow if customers process ShopeePay Payments on a Desktop PC/Laptop.

When users make a purchase on their SmartPhone**

1. Users are automatically redirected to the Shopee app when making purchases on their SmartPhone
2. Users finish the payment on the Shopee app
3. The transaction is complete and their ShopeePay balance is deducted
4. Midtrans will mark the payment_type of the transaction as shopeepay. This will also impact the following:

• The JSON fields format (returned on Webhook/HTTP Notifications & Get Status API response) is "payment_type": "shopeepay"

• The "payment_type": "shopeepay" displayed on Midtrans Dashboard, and when you download transactions.

Note: For a list of failure cases, please refer here.

Detailed Payment Flow for ShopeePay on a Smartphone

This is the payment flow if customers process ShopeePay Payments on a smartphone.

Sample JSON Request Body

{
  "transaction_details": {
    "order_id": "ORDER-101",
    "gross_amount": 10000
  },
  "item_details": [{
    "id": "ITEM1",
    "price": 10000,
    "quantity": 1,
    "name": "Midtrans Bear",
    "brand": "Midtrans",
    "category": "Toys",
    "merchant_name": "Midtrans"
  }],
  "customer_details": {
    "first_name": "TEST",
    "last_name": "MIDTRANSER",
    "email": "[email protected]",
    "phone": "+628123456"
  },
  "enabled_payments": ["shopeepay"],
  "shopeepay": {
    "callback_url": "http://shopeepay.com?order_id=ORDER-101"
  }
}

Implementing ShopeePay Deeplink Callback

In addition to the standard mobile apps flow, you can implement deeplink callback to redirect customer back from ShopeePay to your app.

The steps to integrate with ShopeePay deeplink are given below.

1. Set callback_url with the deeplink URL redirecting to E-commerce apps.
2. Handle redirection with append query param on callback URL or via Dashboard > Snap Preferences.

For a full list of request body parameters please refer to the Request Body (JSON Parameter) section.

🚧

It is highly recommended to avoid using value passed on result to update status on backend. There is HTTP notification for this use case.