# Collecting Payment

Gathering payment method information using Braintree

# Overview

Root uses [Braintree](https://developer.paypal.com/braintree/docs/), a payment processor owned by PayPal, to securely gather and store customer payment method details while supporting PCI compliance.

We require all partners to perform and report their own [PCI SAQ A](https://www.pcisecuritystandards.org/documents/SAQ_A_v3.pdf) ("Self-Assessment Questionnaire A") on a yearly basis in order to process payments externally.

## API integration

Collecting payment requires consuming the `PaymentMethod` input field type, which contains a `client_authorization_token` field. This attribute is a signed JWT that includes configuration and authorization information required by the Braintree client SDK for initialization ([client token documentation](https://developer.paypal.com/braintree/docs/guides/authorization/client-token)). **Although this token might not change for every request, it rotates at least every 24 hours should be re-fetched on a per-page-render basis.**

## Braintree Client integration

Displaying payment fields requires using the `client_authorization_token` to initialize the Braintree client for your platform of choice. ***Note that the official documentation refers to a`client_token` which is the provided `client_authorization_token`.***

Please refer to the official documentation for client setup, as well as well as UI presentation:

* Braintree Client configuration:
  * [Web/JS](https://developer.paypal.com/braintree/docs/start/hello-client/javascript/v3)
  * [iOS (Swift)](https://developer.paypal.com/braintree/docs/start/hello-client/ios/v5)
    * [Custom UI documentation](https://developer.paypal.com/braintree/docs/guides/credit-cards/client-side#initialization)
      * Client-side validation can be overridden by setting `shouldValidate` on an [initialized `BTCard` instance](https://github.com/braintree/braintree_ios/blob/1d4fcd9343bab98759482b4da0b1b6bdaa122b31/Sources/BraintreeCard/Public/BraintreeCard/BTCard.h)
  * [Android (Kotlin/Java)](https://developer.paypal.com/braintree/docs/start/hello-client/android/v4)
    * [Custom UI documentation](https://developer.paypal.com/braintree/docs/start/hello-client/android/v4#present-drop-in-ui)
      * Client-side validation can be overridden by setting `shouldValidate` on an [initialized `Card` instance](https://github.com/braintree/braintree_android/blob/f101f6b06a470292ba09b183c39d6333e4874b00/Card/src/main/java/com/braintreepayments/api/Card.java)
* Payment UI presentation:
  * [Drop-in "batteries-included" UI](https://developer.paypal.com/braintree/docs/start/hello-client#present-drop-in-ui) (universal support)
  * [Hosted fields UI](https://developer.paypal.com/braintree/docs/guides/hosted-fields/setup-and-integration) (web/JS only)
* [Payment testing values](https://developer.paypal.com/braintree/docs/guides/credit-cards/testing-go-live/node/)

## Handling collected payment methods

When a configured Braintree Client collects a payment method, it accesses Braintree's API directly to create a payment method ["nonce"](https://developer.paypal.com/braintree/docs/guides/payment-method-nonces).

A payment method nonce is a secure, one-time-use reference to payment information. It's the key element that allows your server & Root to communicate sensitive payment information to Braintree without ever touching the raw data.

When a nonce has been received back from Braintree using either hosted fields or the drop-in UI, it should be sent back to the respective Step endpoint as a submitted input, with its name matching the provided information on the original `PaymentMethod` field.

## [Flow diagram](https://lucid.app/lucidchart/23f31716-062a-4841-9e64-faf2a7211be6/edit?invitationId=inv_155915b4-adea-4539-98ab-80f5e353ccda)

<Image border={false} src="https://files.readme.io/6170c33-v2_API_Payment_Flow_example1.svg" />