iOS

In this topic, you'll learn how to integrate the card payment SDK into an iOS client so that you can render cashier pages in a mobile application.

Prerequisites

Before integrating the card payment SDK, familiarize yourself with the Integration guide and Overview. This will enable you to understand the steps for integrating server APIs and notes for calling the APIs. Also, ensure that you have completed the following tasks:

Obtain a client ID in Alipay Developer Center.
Properly configure keys in Alipay Developer Center.
Install Xcode 12 or a higher version.
Use iOS 9 or a higher version.

Key integration steps

Integrate the card payment SDK by following these steps:

Import the SDK package

Merchant client

After you download the SDK package in Alipay Developer Center, add AMSComponent.framework to your project, and go to Build Settings > Linking > Other Linker Flags to add -Objc.

Add AMSComponent.framework:

Add -ObjC:

Create an SDK instance by using the AMSCheckout()method:

Merchant client

Create an instance for cashier pages. The instance contains the following parameter:
- configuration: A required object belonging to the AMSConfiguration type. The object must contain all configuration parameters.
Create the AMSConfiguration class, which must contain the following parameters:
- locale: An optional parameter belonging to the NSString type. It is used by the merchant client to identify the browser language and pass in the language information. The SDK uses the information to provide cashier pages in the corresponding language. Valid values are listed as follows. If other values are passed, English is used by default:
  - en_US: English
  - pt_BR: Portuguese
  - ko_KR: Korean
  - es_ES: Spanish
- envType: A required parameter belonging to the NSString type. It is used to pass in environmental information. Valid values are:
  - kAMSCheckoutEnvSANDBOX: sandbox environment
  - kAMSCheckoutEnvPROD: production environment
Create an instance of the AMSLoggerProtocol API, which is used to manage log output. It contains the following method:
- logWithName(): Optional. It is a callback function that is used to output logs by default.

Create an SDK instance:

Objective-C

Editor

Create a configuration object:

Objective-C

Editor

Send a createPaymentSession request to the Alipay server.

Merchant client

After the buyer selects a card payment method for payment, your client starts monitoring the payment button click event. When your client detects that the payment button is clicked, your server needs to send a createPaymentSession request to the Alipay server. After you receive the response from the API call, use the value of the paymentSessionData parameter to complete Step 4.

Note: In your createPaymentSession request, specify paymentRedirectUrl as the URL Scheme that you provide to redirect buyers to the payment result page upon payment completion.

The following sample for calling the createPaymentSession API includes mandatory parameters and several optional parameters.

JSON

Editor

The response sample of the API call is shown as follows:

JSON

Editor

Create a component for collecting payment factors by using the createComponent method in the instantiated object

Merchant client

Create a configuration object by using the paymentSessionData parameter: Pass the complete data in the paymentSessionData parameter obtained in the response through the createPaymentSession API to the paymentSessionData parameter.
Call the createComponent method to create a component for collecting payment factors.

Create a component for collecting payment factors:

Objective-C

Editor

Call the createComponent() method:

Objective-C

Editor

Reference

Event codes

The card payment SDK provides the following event codes:

SDK_INTERNAL_ERROR: A popup on a cashier page failed to be loaded.
SDK_CALL_URL_ERROR: Represents one of the following cases:
- The redirection to the merchant page failed to be executed.
- The parameter paymentRedirectUrl in your createPaymentSession request is not passed or passed incorrectly.

SDK_CREATECOMPONENT_ERROR: The card component failed to be created. Use the correct parameters to call the createComponent method again.

Code sample in key steps

The following code sample shows the key steps during integration. The sample does not include the code used for calling the createPaymentSession API.

Objective-C

Editor