User-presented Mode Payment
With User-presented Mode Payment, the merchant scans the payment that the consumer presents to initiate a payment. Generally, the payment code is displayed on a digital wallet app owned by an Alipay+ Mobile Payment Provider (MPP).
The following key terms are used in this document:
Acquiring Service Provider (ACQP)
An Acquiring Partner participating in Alipay+ Core or other acquirer cooperating with a member of Ant Group to enable payments.
Alipay+ solution is a collaborative effort along with all partners to provide more open, digitalized, and inclusive financial services to worldwide consumers and merchants.
Mobile Payment Provider (MPP)
A Mobile Payment Partner participating in Alipay+ Core or other user- or issuer-facing payment service provider cooperating with a member of Ant Group to enable payments.
User-presented Mode Payment
Payment scenario that the merchant scans the consumer presented code with a device to initiate the payment.
Also known as business-scan-consumer (B-scan-C) code. QR codes or barcodes presented by consumers for merchants to scan with their reading devices to initiate payments.
The following figure illustrates the user experience with the User-presented Mode Payment product:
Figure 1. User experience of User-presented Mode Payment
The user experience consists of the following steps:
- The consumer opens the MPP's app (normally a digital wallet) and then presents the Alipay+ payment code to the merchant. On the top left corner of the payment code, the consumer can always see the Alipay+ logo and may see the Alipay "支" logo based on their current location.
- The merchant scans the payment code that the consumer presents.
- The MPP presents the payment result page to the consumer.
- In the MPP app, the entry to the Alipay+ payment code and the MPP's local payment code is the same. Tab switches are provided so that the consumer can easily switch between the Alipay+ payment code and the local payment code.
- When the consumer opens the Payment Code Page in the MPP app, the MPP app needs to display the Alipay+ payment code if the MPP identifies that the consumer is abroad. If the MPP app fails to obtain the consumer's location, the consumer can switch the local payment code to the Alipay+ payment code manually.
For more information, see Page detail requirements.
The Alipay+ User-presented Mode Payment product provides several capabilities to facilitate your business.
Alipay+ availability notification: When the MPP identifies a consumer is abroad in a location where Alipay+ payment is available, the MPP informs the consumer of Alipay+ availability by in-app notifications or short messages.
- Accept a payment: The MPP takes a series of integration steps to ensure the user completes the payment.
- Automatic code generation: When the customer opens the Alipay+ payment code page and selects a country/region in the MPP app, a QR code is automatically generated by Alipay+ to support payments in that country/region.
- Standardized payment code: The standardized payment code can be used across the globe, which helps the MPP easily reach out to worldwide merchants.
- Promotion provided: With this product, the MPP can directly offer promotional discounts that are provided by Alipay+ to consumers who use the MPP app to pay.
- Multiple currencies supported: With cross-border settlement supported, the MPP can make payments in multiple currencies across the world, as well as allow its consumers to pay in their local currencies.
- Payment result inquiry: The MPP can send the payment result to Alipay+ on Alipay+'s inquiry about the payment status.
- Payment result notification: When the MPP confirms that the payment is successful, Alipay+ actively pushes the payment result to the ACQP, who can then relay the result to merchants.
- Refund: MPPs support both full and partial refunds.
- Cancellation: MPPs support transaction cancellations that are requested by ACQPs within the cancellable period.
- One-stop settlement: Alipay+ provides a unified funds clearing and settlement service for the MPPs. Instead of mutual settlement, the MPPs only need to settle with Alipay+, which greatly simplifies the funds processing and improves the settlement efficiency.
- Alipay+ Partner Workspace: Alipay+ Partner Workspace is a platform where the MPPs can execute operational tasks related to the Alipay+ business, which includes transaction management, risk management, account management, dispute handling, and integration.
How it works
Figure 2. Alipay+ User-presented Mode Payment workflow
After the merchant places an order, the workflow consists of the following steps:
- The MPP app requests a payment code from the MPP server, which calls Alipay+ to get the payment code. Then, the consumer presents the payment code to the merchant.
- The merchant scans the payment code and sends a payment request to Alipay+.
- Alipay+ decodes the payment code to obtain the customer ID, and then sends the payment request with the customer ID to the MPP.
- The MPP debits the payment amount from the consumer's account according to the customer ID.
- The MPP presents the payment result to the consumer on its app.
Page detail requirements
This section describes the design requirements for the three main pages for User-presented Mode Payment.
- Alipay+ Payment Code Page
- Payment Result Page
- Transaction Detail Page
Alipay+ Payment Code Page
The following figure illustrates the fields that can be displayed on the Alipay+ Payment Code Page for User-presented Mode Payment.
Figure 3. Fields for Alipay+ Payment Code Page
Figure 4. Fields for Alipay+ payment code page with region selector and exchange rate
Adhere to the following guidelines for the brand mark and the acceptance mark:
- Always display the Alipay+ logo as a brand mark next to the upper corner of the payment code.
- Selectively display the Alipay "支" logo as an acceptance mark based on the user's current location. The Alipay "支" logo is displayed when Alipay+ supports most of the merchants that accept the Alipay payment method in the area where the user is currently located.
- Keep a certain distance between the Alipay+ logo and the Alipay "支" logo if they are both displayed.
Adhere to the following guidelines for the QR code and the barcode on the Alipay+ Payment Code Page:
- Display the "Alipay+ icon" at the center of the QR code.
- The QR code and barcode are clear and scannable.
- By default, mask part of the barcode number to protect the user information.
To obtain the assets of the Alipay+ icon, see Alipay+ Brand Mark Assets.
Open the Alipay+ payment code page
When the user opens the payment code page in the MPP app, the app must ensure that the user can use the Alipay+ payment code. By default, the MPP needs to automatically obtain the user's current location. If the user is abroad, the MPP automatically opens the Alipay+ payment code page. If the MPP fails to obtain the user's location, the user can manually select the Alipay+ payment code by a tab switch.
Automatically open the Alipay+ payment code page
You can use the location-based service (LBS) or other methods to check if the user is abroad. If the user is abroad, when the user opens the payment code in the MPP app, the MPP app must automatically open the Alipay+ payment code page.
Manually select the Alipay+ payment code
If the MPP app fails to obtain the user's location, you must let the user select the Alipay+ payment code manually. For this, provide an apparent entry to the Alipay+ payment code on the MPP app's payment code page.
It is recommended to use a tab switch as the entry. See the following figure for example:
Payment code related functionalities
On Android, use technical methods to prohibit users from taking screenshots of payment codes.
On iOS, invalidate the code if a screenshot is taken, and notify the user of the prohibition. After the user closes the notification, generate a new code.
When the user clicks Tap to view numbers below the barcode, a security message pops up to warn the user not to share the number with anyone but the cashier. After that, show the unmasked number under the barcode.
QR code scaling
The user can tap the QR code to enlarge it and tap it again to restore it.
The Alipay+ payment code must be refreshed automatically in a periodical manner (one minute). The MPP app can also provide an entry for the user to manually refresh the code. The entry to refresh the code can be set in the "more" option list in the upper right corner of the screen.
Payment Result Page
The following figures illustrate the fields that can be displayed on the Alipay+ Payment Code Page for User-presented Mode Payment.
The payment succeeds:
Figure 4. Fields for Payment Result Page - payment succeeds
The payment fails:
Figure 5. Fields for Payment Result Page - payment fails
The following table lists additional information about the fields in Figures 4 and 5. Information on all of the fields (except the Alipay+ brand) in the table can be obtained from the related APIs.
If the fields in the following table are available, the fields must be provided on the Payment result Page.
The amount that the user pays.
The order amount.
The exchange rate. Used when the order currency differs from the user's payment currency.
The amount of the discount from Alipay+.
If the merchant name is displayed on the Payment Result Page, the merchant name needs to support multiple languages.
Transaction Detail Page
The following figure illustrates the fields that can be displayed on the Transaction Detail Page for User-presented Mode Payment.
Figure 6. Fields for Transaction Detail Page
The following table lists additional information about the fields in Figure 6. Information on all of the fields in the table can be obtained from the related APIs.
If the fields in the following table are available, the fields must be provided on the Transaction Detail Page.
The display name of the merchant. It needs to support multiple languages.
The amount that the user pays.
The transaction number assigned by the merchant.
The amount of the discount from Alipay+.
Optional design standards
Follow the optional standards to ensure an optimal user experience.
Display a country/region list
Due to regulation requirements, some MPPs might have to display the exchange rate between the order currency and the payment currency on the Alipay+ payment code page. In this case, the MPP needs to display a list of the countries/regions that the user can select. When the number of countries/regions takes up more than two mobile screens, the MPP app needs to provide a search capability. The countries/regions need to be listed alphabetically.
In addition, if the MPP app can identify the user's location, the MPP app needs to use the user's country/region by default.
See the following figure for an example:
Design of the QR code & barcode
- Recommended width: 40 mm to 60 mm.
- Recommended height: No less than 14 mm.
- The barcode must be displayed in full and not be obscured in any way.
QR code design
- Recommended height and width: 25 mm to 40 mm.
- Recommended height and width of the Alipay+ icon: around 15%-25% of the QR height and width.
- Leave some empty space around the QR code.
Automatically increase the screen brightness for the Alipay+ payment code page to improve scannability.
To get started with the Alipay+ integration, see Get started with Alipay+ integration.
For more information about how to integrate the User-presented Mode Payment functionalities, see Integration overview for User-presented Mode Payment.