availability

Visa Checkout is currently in a limited release to eligible merchants, and the API is subject to change. Contact us at visacheckout-requests@braintreepayments.com to request access to the release.

Installation

Braintree

In your Podfile, include BraintreeVisaCheckout subspec:

Ruby
Copy
Copied
pod 'BraintreeVisaCheckout'

For other integration options, see the Getting Started section of our README.

Visa Checkout

Visa Checkout for Braintree requires the Visa Checkout SDK running in your app.

important

To install the Visa Checkout SDK, see Visa's documentation on adding Visa Checkout to a mobile application.

The Braintree SDK is currently designed to work with Visa Checkout iOS SDK v5.5.2. Braintree Visa Checkout iOS SDK and Visa Checkout SDK require Xcode 9.2.

Initialization

  1. Initialize the Braintree iOS SDK using the appropriate authorization
  2. Instantiate a BTVisaCheckoutClient:

    Objective-C Swift
    Copy
    Copied
    BTAPIClient *client = [[BTAPIClient alloc] initWithAuthorization:@"<#CLIENT_AUTHORIZATION#>"];
    self.visaCheckoutClient = [[BTVisaCheckoutClient alloc] initWithAPIClient:client];
  3. Get the VisaProfile from the Visa Checkout client:

    Objective-C Swift
    Copy
    Copied
    [self.visaCheckoutClient createProfile:^(VisaProfile * _Nullable profile, NSError * _Nullable error) {
       if (error) {
           NSLog(@"Failed to create Visa profile: %@", error);
           return;
       }
    
       // Customize the Visa Checkout experience
       profile.displayName = @"My Merchant Name";
    
       [VisaCheckoutSDK configureWithProfile:profile result:^(VisaCheckoutConfigStatus status) {
           NSLog(@"Error configuring Visa Checkout: error code %zd", status);
       }];
    }];

Generating a client token

If you choose to use a client token, you must generate it on the server and make it accessible to your client.

To use a merchant account ID other than your default, specify the merchant_account_id when generating the client token. This merchant account ID must match the merchant account ID used to create the transaction.

note

If using 3D Secure with Visa Checkout, the merchant account must have 3D Secure enabled.

Specifying payment details and launching Visa Checkout

note

See Visa Checkout's user interface guidelines for more information on UI and branding requirements.

  1. Create a VisaPurchaseInfo object, passing in an amount and currency
  2. Specify additional payment details on this object, e.g. description, subtotal, shipping
  3. Add a VisaCheckoutButton to your UI
  4. Configure the button with the VisaPurchaseInfo object, and handle purchase completion

Here is an example:

Objective-C Swift
Copy
Copied
VisaCurrencyAmount *total = [[VisaCurrencyAmount alloc] initWithString:@"1.00"];
VisaPurchaseInfo *purchaseInfo = [[VisaPurchaseInfo alloc] initWithTotal:total currency:VisaCurrencyUsd];

// Customize the purchase info
purchaseInfo.customDescription = @"My Description";

// Add checkoutButton to an appropriate view in your UI
VisaCheckoutButton *checkoutButton = [[VisaCheckoutButton alloc] initWithFrame:CGRectMake(0, 0, 213, 47)];
[self.view addSubview:checkoutButton];

[checkoutButton onCheckoutWithPurchaseInfo:purchaseInfo completion:^(VisaCheckoutResult *result) {
    // Visa Checkout authorization result
}];

Tokenizing

  1. Call tokenizeVisaCheckoutResult:completion: with a VisaCheckoutResult
  2. We tokenize the result and return a VisaCheckoutNonce in the completion block

Here is an example:

Objective-C Swift
Copy
Copied
[checkoutButton onCheckoutWithPurchaseInfo:purchaseInfo completion:^(VisaCheckoutResult *result) {
    [self.visaCheckoutClient tokenizeVisaCheckoutResult:result
        completion:^(BTVisaCheckoutCardNonce * _Nullable tokenizedVisaCheckoutCard, NSError * _Nullable error) {
        if (error) {
            NSLog(@"Error tokenizing Visa Checkout card: %@", error.localizedDescription);
        } else if (tokenizedVisaCheckoutCard) {
            // Send this nonce to your server, and create a transaction there.
            NSString *nonce = tokenizedVisaCheckoutCard.nonce;

            // Access Visa Checkout properties from this `VisaCheckoutCardNonce`, e.g.
            BTVisaCheckoutAddress *shippingAddress = tokenizedVisaCheckoutCard.shippingAddress;
        } else {
            // User cancelled.
        }
    }];
}];

Full example

This is a full example of the integration between Braintree and Visa Checkout if you are not using 3D Secure. This example will allow you to get started, and provides a reference while integrating into your existing code base.

Objective-C Swift
Copy
Copied
@interface VisaCheckoutViewController ()
@property (nonatomic, strong) BTAPIClient *client;
@property (nonatomic, strong) BTVisaCheckoutClient *visaCheckoutClient;
@end

@implementation VisaCheckoutViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    self.client = [[BTAPIClient alloc] initWithAuthorization:@"<#CLIENT_AUTHORIZATION#>"];
    self.visaCheckoutClient = [[BTVisaCheckoutClient alloc] initWithAPIClient:self.client];

    [self.visaCheckoutClient createProfile:^(VisaProfile * _Nullable profile, NSError * _Nullable error) {
        if (error) {
            NSLog(@"Failed to create Visa profile: %@", error.localizedDescription);
            return;
        }

        // Customize the Visa Checkout experience
        profile.displayName = @"My Merchant Name";

        [VisaCheckoutSDK configureWithProfile:profile result:^(VisaCheckoutConfigStatus status) {
            NSLog(@"Error configuring Visa Checkout: error code %zd", status);
        }];
    }];

    VisaCurrencyAmount *total = [[VisaCurrencyAmount alloc] initWithString:@"1.00"];
    VisaPurchaseInfo *purchaseInfo = [[VisaPurchaseInfo alloc] initWithTotal:total currency:VisaCurrencyUsd];

    // Customize the purchase info
    purchaseInfo.customDescription = @"My Description";

    VisaCheckoutButton *checkoutButton = [[VisaCheckoutButton alloc] initWithFrame:CGRectMake(0, 0, 213, 47)];
    [self.view addSubview:checkoutButton];

    [checkoutButton onCheckoutWithPurchaseInfo:purchaseInfo completion:^(VisaCheckoutResult *result) {
        [self.visaCheckoutClient tokenizeVisaCheckoutResult:result
            completion:^(BTVisaCheckoutCardNonce * _Nullable tokenizedVisaCheckoutCard, NSError * _Nullable error) {
            if (error) {
                NSLog(@"Error tokenizing Visa Checkout card: %@", error.localizedDescription);
            } else if (tokenizedVisaCheckoutCard) {
                // Send the payment method nonce to your server to create a transaction.
                NSLog(@"Got a nonce! %@", tokenizedVisaCheckoutCard.nonce);

                // Access VisaCheckout properties from the tokenizedVisaCheckoutCard, e.g.
                BTVisaCheckoutAddress *shippingAddress = tokenizedVisaCheckoutCard.shippingAddress;
            } else {
                // User cancelled
            }
        }];
    }];
}

@end

Next steps

Still have questions?

If you can’t find an answer, contact our Support team.