Google & Apple Pay tokenization button

Collect and tokenize credit cards stored in the cardholders' Google or Apple Pay wallet with our native mobile SDK tokenisation button integration. This API provides you the option to place a Google or Apple Pay button in your native mobile app.
Please note that displaying the Google or Apple Pay button uses the payment transactions API instead of the tokenization API. If you only want to collect and tokenize credit card number and cvv code continue with the integration documented here.

Follow the step-by-step guide below to get the Google and Apple Pay tokenization button up and running.
Refer to the standard mobile SDK integration for more detailed information and resources about the mobile SDK.

1. Account setup

Apple Pay

Apple Pay requires you to setup an Apple developer account and manage the certifications. Please refer to Apple Pay setup and follow the step-by-step setup guide. This configuration has to be done per project (merchantID) - therefore you don't need to add another configuration if you already have one and the same merchantID is used.

Google Pay

No separate setup needed for Google Pay.

2. Determine payment methods

📘

Because different payment methods require different flows, your app must display a payment selection screen and call the corresponding API based on the user's choice.

To determine the list of available methods, you may consider factors such as the user's geographic location, transaction amount, and currency. Additionally, you can add Apple Pay to the list on Apple devices and Google Pay on Android devices based on a set of criteria as follows:

Apple Pay

Invoke the static method hasApplePay on ApplePayConfig to check whether Apple Pay is available on the user’s Apple device.

ApplePayConfig.hasApplePay(  
    withSupportedNetworks: <networks>,  
    existingCardRequired: <existingCardRequired>  
)

whereas:

  • networks is the array of supported cards, e g. [.masterCard, .visa, .amex]
  • existingCardRequired is a boolean to specify whether users can add a new card to Apple Pay during the process or if a previously registered card is mandatory.

If the method returns false, Apple Pay is not available on the device for the given settings and therefore the Apple Pay button should not be displayed on the selection screen.

Google Pay

Invoke the static method hasGooglePay on GooglePayConfig to check whether Google Pay is available on the user’s Android device.

GooglePayConfig.hasGooglePay(  
    supportedNetworks: <networks>,  
    authenticationMethods: <authenticationMethods>,  
    existingPaymentMethodRequired: <existingPaymentMethodRequired>,  
    isTesting: <isTesting>  
)

whereas:

  • networks is a list of supported cards, e g. listOf(PaymentMethodType.VISA, PaymentMethodType.MASTER_CARD)
  • authenticationMethods specifies whether only tokenized cards are accepted (use AuthenticationMethodType.CRYPTOGRAM_3DS)or non-tokenized cards are also allowed (use listOf(AuthenticationMethodType.PAN_ONLY, AuthenticationMethodType.CRYPTOGRAM_3DS) ). Note: The 3-D Secure process is automatically started for non-tokenized cards if the merchant has a 3-D Secure configuration. Otherwise, the card will still be tokenized but without 3-D Secure parameters and the 3-D step-up process can then be done at a later time just like with card tokens obtained from the tokenization flow.
  • existingPaymentMethodRequired is a boolean to specify whether users can add a new card to Google Pay during the process or if a previously registered card is mandatory.
  • isTesting is a boolean that must be set to true in the sandbox environment

If the method returns false, Google Pay is not available on the device for the given settings and therefore the Google Pay button should not be displayed on the selection screen.

3. Backend init request

Once you determined the payment method, start with initialising a transaction by calling the /v1/transactions endpoint from your merchant backend. It returns a mobileToken which needs to be used in the next step to start the process.

{
	"refno": "ref-12345",
	"currency": "EUR",
	"amount": 1000,
	"paymentMethods": ["APL","PAY"],
	"option": {
		"authenticationOnly": true,
		"returnMobileToken": true
	}
}
{
    "mobileToken": "e6c371fb60219b8b058d9cd94a1f77a2033510854437c1aa"
}

📘

Remarks

  • amount is in minor currency units (cents, pence, etc.), €10 in the example above
  • Use single payment method APL for Apple Pay and PAY for Google Pay in the list of payment methods to directly start the wallet tokenization flow
  • Be sure to set option authenticationOnly to true, it will not work otherwise
  • Set option returnMobileToken to true for mobile SDK flows

Please refer to the API specification for more information.

4. Configuration

Apple Pay

The init request returns a mobile token that uniquely identifies the transaction. Return the token to your app and then pass it to the SDK’s Transaction.init method. Additionally, Apple Pay must be configured for the SDK in the same way as in step 1).

 let paymentNetworks: [PKPaymentNetwork] = <networks>
 let applePayConfig = ApplePayConfig(applePayMerchantId: <applePayMerchantId>, 
                                     supportedNetworks: paymentNetworks)
 applePayConfig.existingCardRequired = <existingCardRequired>
 applePayConfig.finalSummaryItemLabel = <merchantName>

 let transaction = Transaction.init(mobileToken: <mobileToken>)
 transaction.options.applePayConfig = applePayConfig
 transaction.options.testing = <isTesting>
 transaction.delegate = <delegate>

 transaction.start(presentingController: <viewController>)

whereas:

  • networks is the array of supported cards, e g. [.masterCard, .visa, .amex]
  • applePayMerchantId is the Apple Pay merchant identifier set up in Apple’s developer portal
  • existingCardRequired is a boolean to specify whether users can add a new card to Apple Pay during the process or if a previously registered card is mandatory
  • merchantName is a name shown on the Apple Pay sheet as “Pay {merchantName}”
  • mobileToken is the token obtained from the backend init request
  • isTesting is a boolean that must be set to true in the sandbox environment
  • delegate is your implementation of the TransactionDelegate to receive feedback when the process is finished (mandatory)
  • viewController is a UIViewController of your app on top of which the payment sheet is presented

Google Pay

The init request returns a mobile token that uniquely identifies the transaction. Return the token to your app and then pass it to the SDK’s Transaction constructor. Additionally, Google Pay must be configured for the SDK in the same way as in step 1).

val googlePayConfig: GooglePayConfig = GooglePayConfig.Builder(
    supportedNetworks = <networks>, 
    merchantName = <merchantName>)
    .allowedAuthenticationMethods(<authenticationMethods>)
    .build()

val transaction: Transaction = Transaction(mobileToken = <mobileToken>)
transaction.options.googlePayConfig = googlePayConfig
transaction.options.isTesting = <isTesting>
transaction.listener = <listener>

transaction.start(<activity>)

whereas:

  • networks is a list of supported cards, e g. listOf(PaymentMethodType.VISA, PaymentMethodType.MASTER_CARD)
  • merchantName is a name shown on the Google Pay sheet as “Pay {merchantName}”
  • authenticationMethods specifies whether non-tokenized cards are accepted too. See step 1) above for a more detailed explanation
  • mobileToken is the token obtained from the backend init request
  • isTesting is a boolean that must be set to true in the sandbox environment
  • listener is your implementation of the TransactionListener to receive feedback when the process is finished (mandatory)
  • activity is your Android Activity, used by the SDK to display the payment sheet

5. Obtain PCI Proxy token

To obtain a PCI Proxy token, submit the transactionId returned in TransactionSuccess.transactionId from the mobile SDK to your server and call the transaction status endpoint. Additionally, this API also returns a card.3D object which contains information about the result of the authentication process when available.

Example

curl --request GET \
  --url 'https://api.sandbox.datatrans.com/v1/transactions/{transactionId}' \
  --header 'Authorization: Basic {merchantId}:{password}'
{
	     "transactionId" : "230629114903291726",
	     "merchantId" : "1100000000",
	     "type" : "payment",
	     "status" : "authenticated",
	     "currency" : "EUR",
	     "refno" : "ref-12345",
	     "paymentMethod" : "VIS",
	     "detail" : {
	       "authorize" : {
	         "amount" : 1000
	       }
	     },
	     "language" : "de",
	     "card" : {
	       "alias" : "7LHXscqwAAEAAAGJBo5n6T35EsAHAMPa",
	       "fingerprint" : "F-dgPPkIenKzjz1B9ircrLGN",
	       "masked" : "412374xxxxxx0013",
	       "aliasCVV" : null,
	       "expiryMonth" : "06",
	       "expiryYear" : "25",
	       "walletIndicator" : "APL",
	       "3D" : {
	         "xid" : "MDAyMzA2MjkxMTQ5MDMyOTE3MjY=",
	         "cavv" : "AIp6O57Tn8BBAHFF6vrMAoABFA==",
	         "threeDSVersion" : "2.2",
	         "directoryResponse" : "Y",
	         "authenticationResponse" : "Y"
	       }
	     },
	     "history" : [ ]
	   }

6. Next steps

Use the alias returned in step 5) and continue as usual with any downstream operations using the various PCI Proxy APIs.