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 Visa Checkout iOS SDK and Visa Checkout SDK requires Swift 3.0 and Xcode 8.2.1.

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

Initialization

  1. Initialize the Braintree iOS SDK using either a tokenization key or a client token from your server

  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);
       }];
    }];

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. 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: Server-side →

Still have questions?

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