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:
networksis the array of supported cards, e g.[.masterCard, .visa, .amex]existingCardRequiredis 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:
networksis a list of supported cards, e g. listOf(PaymentMethodType.VISA, PaymentMethodType.MASTER_CARD)authenticationMethodsspecifies whether only tokenized cards are accepted (useAuthenticationMethodType.CRYPTOGRAM_3DS)or non-tokenized cards are also allowed (uselistOf(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.existingPaymentMethodRequiredis 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.isTestingis 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
amountis in minor currency units (cents, pence, etc.), €10 in the example above- Use single payment method
APLfor Apple Pay andPAYfor Google Pay in the list of payment methods to directly start the wallet tokenization flow- Be sure to set option
authenticationOnlytotrue, it will not work otherwise- Set option
returnMobileTokentotruefor 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] applePayMerchantIdis the Apple Pay merchant identifier set up in Apple’s developer portalexistingCardRequiredis a boolean to specify whether users can add a new card to Apple Pay during the process or if a previously registered card is mandatorymerchantNameis a name shown on the Apple Pay sheet as “Pay {merchantName}”mobileTokenis the token obtained from the backend init requestisTestingis a boolean that must be set to true in the sandbox environmentdelegateis your implementation of theTransactionDelegateto receive feedback when the process is finished (mandatory)viewControlleris aUIViewControllerof 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) merchantNameis a name shown on the Google Pay sheet as “Pay {merchantName}”authenticationMethodsspecifies whether non-tokenized cards are accepted too. See step 1) above for a more detailed explanationmobileTokenis the token obtained from the backend init requestisTestingis a boolean that must be set to true in the sandbox environmentlisteneris your implementation of theTransactionListenerto receive feedback when the process is finished (mandatory)activityis your AndroidActivity, 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.
Updated almost 2 years ago