Alberto Lopez's Slides at NSSpain 2014

Transcript

1. v.zero A modern foundation for accepting Payments Alberto López (@albertusLM) PayPal / Braintree Developer Evangelist
2. Developing the mobile application @albertuslm
4. Adding the payment @albertuslm
7. I only want to integrate a payment method…
8. we need help! @albertuslm
11. photo  source
12. Client Side Server Side
13. Payment flow
14. Source + = P.I. (a.k.a. Payment integration) formula Source
15. Source  photo @albertuslm
16. 1.Create a new empty project and add to it a podfile. 2.Open the pod file and add: 3. Run it: 4. After the installation, you will have to use <nameOfProject>.xcworkspace pod  'Braintree'  #  Alternatively:  pod  'Braintree',  '~>  3.0.0' pod  install Installing the SDK Client Side
17. 1.Create a composer file on your server directory. 2.Open the composer.json file and add: 3. Run it: 4. Create a config file storing in it the API credentials {      "require"  :  {"braintree/braintree_php"  :  "2.30.0"}   } composer  install Braintree_Configuration::environment('sandbox');   Braintree_Configuration::merchantId('use_your_merchant_id');   Braintree_Configuration::publicKey('use_your_public_key');   Braintree_Configuration::privateKey('use_your_private_key'); Installing the SDK Server Side
18. Lesson 1: Single payment @albertuslm photo  source
19. 1.Request the client token to your server: #import "AFNetworking.h" #import "Braintree/Braintree.h" […]   - (void)viewDidLoad { [super viewDidLoad]; AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@"http://localhost/BraintreeServer/client_token.php" parameters: nil success: ^(AFHTTPRequestOperation *operation, id responseObject) { NSString *clientTokenFromServer = [[NSString alloc] initWithString:responseObject[@"client_token"]]; self.braintree = [Braintree braintreeWithClientToken:clientTokenFromServer]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { NSLog(@"Error: %@", error); }]; } Simple payment Client Side
20. 1.Request the client token to your server: Simple payment Client Side #import "AFNetworking.h" #import "Braintree/Braintree.h" […]   - (void)viewDidLoad { [super viewDidLoad]; AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@"http://localhost/BraintreeServer/client_token.php" parameters: nil success: ^(AFHTTPRequestOperation *operation, id responseObject) { NSString *clientTokenFromServer = [[NSString alloc] initWithString:responseObject[@"client_token"]]; self.braintree = [Braintree braintreeWithClientToken:clientTokenFromServer]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { NSLog(@"Error: %@", error); }]; } #import "AFNetworking.h" #import "Braintree/Braintree.h" […]   - (void)viewDidLoad { [super viewDidLoad]; AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@"http://localhost/BraintreeServer/client_token.php" parameters: nil success: ^(AFHTTPRequestOperation *operation, id responseObject) { NSString *clientTokenFromServer = [[NSString alloc] initWithString:responseObject[@"client_token"]]; self.braintree = [Braintree braintreeWithClientToken:clientTokenFromServer]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { NSLog(@"Error: %@", error); }]; }
21. 2. Convert that ViewController in delegate of BTDropInViewControllerDelegate and create a method to instantiate Braintree object @interface ViewController ()<BTDropInViewControllerDelegate> […]   - (IBAction)tappedMyPayButton { BTDropInViewController *dropInViewController = [self.braintree dropInViewControllerWithDelegate:self]; dropInViewController.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(userDidCancelPayment)]; UINavigationController *navigationController = [[UINavigationController alloc] initWithRootViewController:dropInViewController]; [self presentViewController:navigationController animated:YES completion:nil]; } Simple payment Client Side
22. 2. Convert that ViewController in delegate of BTDropInViewControllerDelegate and create a method to instantiate Braintree object @interface ViewController ()<BTDropInViewControllerDelegate> […]   - (IBAction)tappedMyPayButton { BTDropInViewController *dropInViewController = [self.braintree dropInViewControllerWithDelegate:self]; dropInViewController.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(userDidCancelPayment)]; UINavigationController *navigationController = [[UINavigationController alloc] initWithRootViewController:dropInViewController]; [self presentViewController:navigationController animated:YES completion:nil]; } Simple payment Client Side @interface ViewController ()<BTDropInViewControllerDelegate> […]   - (IBAction)tappedMyPayButton { BTDropInViewController *dropInViewController = [self.braintree dropInViewControllerWithDelegate:self]; dropInViewController.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(userDidCancelPayment)]; UINavigationController *navigationController = [[UINavigationController alloc] initWithRootViewController:dropInViewController]; [self presentViewController:navigationController animated:YES completion:nil]; }
23. 3. Create the method to call to the server with the nonce… -(void)dropInViewController:(__unused BTDropInViewController *)
 viewController didSucceedWithPaymentMethod:(BTPaymentMethod *)paymentMethod
 { [self postNonceToServer:paymentMethod.nonce]; [self dismissViewControllerAnimated:YES completion:nil]; } Simple payment Client Side
24. 3. Create the method to call to the server with the nonce… Simple payment Client Side -(void)dropInViewController:(__unused BTDropInViewController *)
 viewController didSucceedWithPaymentMethod:(BTPaymentMethod *)paymentMethod
 { [self postNonceToServer:paymentMethod.nonce]; [self dismissViewControllerAnimated:YES completion:nil]; } -(void)dropInViewController:(__unused BTDropInViewController *)
 viewController didSucceedWithPaymentMethod:(BTPaymentMethod *)paymentMethod
 { [self postNonceToServer:paymentMethod.nonce]; [self dismissViewControllerAnimated:YES completion:nil]; }
25. 3. (Continue…) - (void)postNonceToServer:(NSString *)paymentMethodNonce { AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@“http://<whereyouhavethefiles>/finish_payment.php" parameters:@{@"payment-method-nonce": paymentMethodNonce, @"amount": @"250", } success:^(AFHTTPRequestOperation *operation, id responseObject) { NSString *transactionID = [[NSString alloc] initWithString:responseObject[@"transaction_id"]]; self.labelInView.text = [[NSString alloc] initWithFormat:@"OK: %@-%@", transactionID,token ]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { self.labelInView.text = [[NSString alloc] initWithFormat:@"KO: %@", error ]; }]; } Simple payment Client Side
26. 3. (Continue…) Simple payment Client Side - (void)postNonceToServer:(NSString *)paymentMethodNonce { AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@“http://<whereyouhavethefiles>/finish_payment.php" parameters:@{@"payment-method-nonce": paymentMethodNonce, @"amount": @"250", } success:^(AFHTTPRequestOperation *operation, id responseObject) { NSString *transactionID = [[NSString alloc] initWithString:responseObject[@"transaction_id"]]; self.labelInView.text = [[NSString alloc] initWithFormat:@"OK: %@-%@", transactionID,token ]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { self.labelInView.text = [[NSString alloc] initWithFormat:@"KO: %@", error ]; }]; } - (void)postNonceToServer:(NSString *)paymentMethodNonce { AFHTTPRequestOperationManager *manager = [AFHTTPRequestOperationManager manager]; [manager POST:@“http://<whereyouhavethefiles>/finish_payment.php" parameters:@{@"payment-method-nonce": paymentMethodNonce, @"amount": @"250", } success:^(AFHTTPRequestOperation *operation, id responseObject) { NSString *transactionID = [[NSString alloc] initWithString:responseObject[@"transaction_id"]]; self.labelInView.text = [[NSString alloc] initWithFormat:@"OK: %@-%@", transactionID,token ]; } failure:^(AFHTTPRequestOperation *operation, NSError *error) { self.labelInView.text = [[NSString alloc] initWithFormat:@"KO: %@", error ]; }]; }
27. 1. Provide a Client token to the client side $clientToken = Braintree_ClientToken::generate(); Simple payment Server Side 2. Receive the payment method nonce from the client $nonce = $_POST["payment_method_nonce"] 3. And use it to create the transaction $amount = $_POST["amount"]; $result = Braintree_Transaction::sale(array( 'amount' => '100.00', 'paymentMethodNonce' => 'nonce-from-the-client'));
28. TIME TO CODE
29. Lesson 2: storing customers @albertuslm photo  source
30. $result = Braintree_Customer::create(array( 'firstName' => 'Mike', 'lastName' => 'Jones', 'company' => 'Jones Co.', 'email' => 'mike.jones@example.com', 'phone' => '281.330.8004', 'fax' => '419.555.1235', 'website' => ‘http://example.com' 'paymentMethodNonce' => 'nonce-from-the-client' )); if ($result->success==TRUE) { echo $result->customer->id; }; Storing info about customers Server Side 1. Storing info of your costumers in Braintree allows you to use the costumer ID Braintree gives you for payments in vault
31. $result = Braintree_Customer::create(array( 'firstName' => 'Mike', 'lastName' => 'Jones', 'company' => 'Jones Co.', 'email' => 'mike.jones@example.com', 'phone' => '281.330.8004', 'fax' => '419.555.1235', 'website' => ‘http://example.com' 'paymentMethodNonce' => 'nonce-from-the-client' )); if ($result->success==TRUE) { echo $result->customer->id; echo($result->customer->creditCards[0]->token); }; 1. Storing info of your costumers in Braintree allows you to use the costumer ID Braintree gives you for payments in vault. Storing info about customers Server Side Store this info!
32. go again to xcode
33. Lesson 3: payment in v aul t @albertuslm photo  source
34. 1. With the Client ID or the payment method, you will be able to complete the payments without having to redirect to the costumer to Braintree. Payment in vault Server Side $result = Braintree_Transaction::sale( array( 'paymentMethodToken' => 'the_payment_method_token', 'amount' => '100.00' ) ); $result = Braintree_Transaction::sale( array( 'customerId' => 'the_customer_id', 'amount' => '100.00' ) );
35. final lap!
36. Original  Source S @albertuslm
37. Braintree: https://www.braintreepayments.com/ Get Started with Braintree https://developers.braintreepayments.com/ios+php/start/overview One TouchTM overview: https://developers.braintreepayments.com/ios+php/guides/one-touch Braintree v.zero: https://www.braintreepayments.com/v.zero Sandbox environment: https://sandbox.braintreegateway.com/login Code of exercices: https://github.com/albertuslm/BraintreeSample.git
38. The end?
39. photo  source Stay tuned…
40. Questions? Think twice before asking, seriousl y Source  photo
41. v.zero Alberto López Martín EMEA Developer Evangelist 
 alopezmartin@paypal.com / @albertuslm