Braintree
You can accept payments in your app using Braintree (a service provided by PayPal) integration. This will also allow your users to pay directly using a credit card or using a service like PayPal, Google Pay, or Apple Pay
Prerequisites
Before starting to set up payments, make sure you have:
Completed all the steps of Firebase Setup for your project.
Upgraded your Firebase project to Blaze Plan.
Enabled Firebase Authentication for your project.
FlutterFlow uses Firebase Cloud Functions to process a transaction using the selected service (Braintree/PayPal).
Braintree Integration
Integrating the Braintree in your app comprises the following steps:
1. Setup payments integration
Payments can be set up on FlutterFlow using Braintree.
You should always test your payment processing using a Sandboxed environment, before deploying them to a production environment.
Follow the steps below to set up using Braintree:
Go to Braintree Website.
Sign up for getting access to the Sandboxed environment. You might receive an email with the additional steps for completing the sign-up process. If you already have a Braintree account just Log In.
Navigate to the Braintree Settings page of your FlutterFlow project by going to the Settings and Integrations > In App Purchases & Subscriptions > Braintree.
On this page, Enable Braintree/PayPal using the toggle.
Under the Credentials (Sandbox) section, you need to enter the Merchant ID, Tokenization Key, Public Key & Private Key of the Braintree account.
To get the required credentials, navigate to your Braintree account Home page.
Click the gear icon (top-right corner), select Business. From this page, you'll get the Merchant ID.
Now, go to the API page. Here, you'll get the Public Key & Private Key.
To generate a Tokenization Key, go to the API page, and click Generate New Tokenization Key. Copy the Key and enter it in the respective field of FlutterFlow.
Finally, click Deploy to upload the Cloud Functions required for processing a payment using Braintree:
2. Enable Google Pay or Apple Pay (Optional)
Completing the payment integration by following the above steps will allow you to accept payments using a credit card or a PayPal account. Additionally, you can accept payments using Google Pay or Apple Pay.
To accept payments using Google Pay or Apple Pay, you'll need to enter the respective Merchant ID of the Google/Apple account in the Braintree Settings page > Credentials (Sandbox) section.
To know how to find the Google Pay Merchant ID, navigate to this page.
Steps for configuring Apple Pay and getting access to the Apple Merchant ID are here.
3. Trigger payment action
In order to initiate a payment, you have to use the Braintree Payment Action. Know how to define a payment action by going to the following page:
pageBraintree Payment4. Testing
Braintree payments work on real Android devices or in emulators, and App Store purchases only work on real iOS devices. This document has instructions on how to run your app on an Android or iOS device.
The Braintree Payments cannot be tested in Preview Mode, Test Mode, or Run Mode.
To test your app before deployment:
Download and run your project as described here.
To test the purchase, you can use any of these basic test card numbers.
5. Releasing to production
Before you release the app to production, complete the following steps:
Create the Braintree Account (Not sandbox) and get the production credentials.
Add the production credentials in the FlutterFlow Braintree Settings page > Credentials (Production) section.
Turn on the Is Production toggle present on that page.
Deploy the new Firebase Cloud Functions with the production credentials by clicking on the Deploy button.
Now, you are ready to build and distribute your app with payments to production.
Last updated
