Braintree Auth (Beta)
Client-side Connect Flow
The following Connect flow will guide merchants through authorization in your iOS app without exposing your client_secret
:
- The merchant taps the Connect with Braintree button in your app
- Your app sends the merchant to Braintree for authorization using an SFSafariViewController
- Once the merchant has authorized, Braintree redirects them to the
redirect_uri
specified by theconnect_url
- Your server performs the OAuth exchange
- Your server redirects the merchant to a URL that is captured by a Custom URL Scheme in your mobile app
Button
- Download the connect-braintree-ios assets
- Add the button images as a new image set in your Xcode project's Asset Catalog
- Add a button object to your view, using the assets you added as the button's image
- Create an action for your button in your view's controller
Send the merchant to Braintree
Import SafariServices
in your view's controller and extend SFSafariViewControllerDelegate
.
Once that's done, create a property that holds SFSafariViewController
, which you'll define later.
- Swift
// ViewController.swift
import UIKit
import SafariServices
class ViewController: UIViewController, SFSafariViewControllerDelegate {
var safariVC: SFSafariViewController?
In the button action you created earlier, instantiate an SFSafariViewController
with a connect_url
retrieved from your server:
- Swift
@IBAction func connectAction(sender: UIButton) {
self.safariVC = SFSafariViewController(url: URL(string: CONNECT_URL_FROM_SERVER)!)
self.safariVC!.delegate = self
self.present(self.safariVC!, animated: true, completion: nil)
}
Prepare for the merchant's return
Now that you have a way of sending the merchant to Braintree, you'll need to make sure they have a way of returning to your app.
First, define a global constant at the top level of your view's controller to be used as the event name:
- Swift
// ViewController.swift
extension Notification.Name {
static let braintreeConnectedRedirectNotification = Notification.Name(rawValue: "braintreeConnectedRedirectNotification")
}
class ViewController: UIViewController, SFSafariViewControllerDelegate { ... }
Next, add an observer in the viewDidLoad
method of your view's controller to handle the redirect from Braintree:
- Swift
override func viewDidLoad() {
super.viewDidLoad()
NotificationCenter.default.addObserver(self, selector: #selector(braintreeLogin(notification:)), name: .braintreeConnectedRedirectNotification, object: nil)
}
Finally, define the corresponding braintreeLogin
callback to dismiss the Safari view:
- Swift
func braintreeLogin(notification: NSNotification) {
self.safariVC?.dismiss(animated: true, completion: nil)
// perform any additional actions like transitioning to another view here
}
Capturing the custom URL
After performing the OAuth exhange, your server will redirect your merchant back to a custom URL that your app will capture. To do that, we'll need to define URL schemes and define a function in your app's AppDelegate
.
URL schemes
Update your project's Info.plist
CFBundleURLTypes
property to enable your app to handle custom URL schemes:
- XML
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>authredirect</string>
<key>CFBundleURLSchemes</key>
<array>
<string>examplescheme</string>
</array>
</dict>
</array>
Application delegate
Define a function to handle the custom URL in your AppDelegate
that will ensure the URL is from a trusted source and broadcast an event to our view:
- Swift
// AppDelegate.swift
func application(application: UIApplication, openURL url: NSURL, sourceApplication: String?, annotation: AnyObject) -> Bool {
NotificationCenter.default.post(name: .braintreeConnectedRedirectNotification, object: url)
return true
}
Broadcasting this event will trigger the braintreeLogin
callback you defined earlier in your view's controller. This brings the merchant back into your application and completes the authorization flow.
Next Page: OAuth Flow →