Alipay+ DocsAlipay+ Docs

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).

Basic concepts

The following key terms are used in this document:

Term (Abbreviation)

Definition

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+

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.

payment code

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.

User experience

The following figure illustrates the user experience with the User-presented Mode Payment product:

image

Figure 1. User experience of User-presented Mode Payment

The user experience consists of the following steps:

  1. The consumer opens the MPP's app (normally a digital wallet), and then presents the Alipay+ payment code to the merchant.
  2. The merchant scans the payment code that is presented by the consumer.
  3. The MPP presents the payment result page to the consumer.

Notes:

  • In the MPP app, the entry for the Alipay+ payment code is the same as that for the MPP's local payment code.
  • When the user opens the Payment Code Page in the MPP app, if the MPP app can detect that the user is abroad, the MPP app can automatically display the Alipay+ payment code.

For more information, see Page detail requirements.

Product functionalities

The Alipay+ User-presented Mode Payment product provides several capabilities to facilitate your business.

Payment

  • 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.

Post payments

  • Refund: MPPs support both full and partial refunds.
  • Cancellation: MPPs support transaction cancellations that are requested by ACQPs within the cancellable period.

Business operations

  • 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.
  • Alipay+ Center: Alipay+ Center is a value-added module that can be added to the MPP app to enhance users' cross-border payment experience. It consists of Alipay+ brand introduction, payment-related services, and user incentives.

How it works

image

Figure 2. Alipay+ User-presented Mode Payment workflow

After the merchant places an order, the workflow consists of the following steps:

  1. 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.
  2. The merchant scans the payment code and sends a payment request to Alipay+.
  3. Alipay+ decodes the payment code to obtain the customer ID, and then sends the payment request with the customer ID to the MPP.
  4. The MPP debits the payment amount from the consumer's account according to the customer ID.
  5. 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.

image

Figure 3. Fileds for Alipay+ Payment Code Page

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. The MPP app can either open the Alipay+ payment code page automatically or let the user select the Alipay+ payment code.

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.

image

Manually select the Alipay+ payment code

You must let the user select the Alipay+ payment code manually. For this, provide an apparent entry for the Alipay+ payment code on the MPP app's payment code page.

It is recommended to use a tab switch or a button as the entry. See the following figures for examples:

Tab switch

image

Button

image

Payment code related functionalities

Screenshot prohibitions

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.

image

Barcode numbers

When the user clicks the View numbers button below the barcode, pop up a security message to warn the user not to share the number with anyone but the cashier. After that, show the unmasked number under the barcode.

image

Code refresh

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:

image

Figure 4. Fields for Payment Result Page - payment succeeds

The payment fails:

image

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 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.

Field

Description

Merchant name

The display name of the merchant.

Order amount

The order amount.

Exchange rate

The exchange rate. Used when the order currency differs from the user's payment currency.

Payment amount

The amount that the user pays.

Alipay+ discount

The amount of the discount from Alipay+.

Transaction Detail Page

The following figure illustrates the fields that can be displayed on the Transaction Detail Page for User-presented Mode Payment.

image

Figure 6. Fields for Transaction Detail Page

The following table lists additional information about the fields in figures 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.

Field

Description

Merchant name

The display name of the merchant.

Order amount

The order amount.

Transaction No.

The transaction number assigned by the merchant.

Alipay+ discount

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

By 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.

In addition, if the MPP app can detect the user's location, the MPP app needs to use the user's country/region by default.

See the following figure for an example:

image

Design of the QR code & barcode

Barcode design

  • Recommended width: 40mm to 60mm.
  • Recommended height: No less than 14mm.
  • The barcode must be displayed in full and not be obscured in any way.

image

QR code design

  • Recommended height and width: 25mm to 40mm.
  • 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.

image

Screen brightness

Automatically increase the screen brightness for the Alipay+ payment code page to improve the scannability.

Dropdown list as the Alipay+ QR code entrance

Condition: The Alipay+ code is generated on the same page as the MPP local codes.

You can use a dropdown list to let the user select the Alipay+ payment code manually on the payment code page:

image

For standard Alipay+ code entrance design, see Manually select the Alipay+ payment code.

Get started

To get started with the integration of the User-presented Mode Payment functionalities, see Integration overview for User-presented Mode Payment.