Integrating on the Web with Braintree.js
Signup for a Sandbox account
Follow the tutorials
Complete your integration and Sandbox testing
Go through the apply process
Most applications are instantly approved so you can start processing real transactions immediately, and it only takes about 10 minutes to complete.
Test in Production
The Braintree.js library allows you to encrypt sensitive-data in your customer’s browser before it is sent to your server. This means your customers can complete their sale with only one HTTPS request.
To use Braintree.js all you need to do is add
data-encrypted-name attributes onto your inputs, then include the Braintree.js library and initialize it with your client-side encryption key.
<html> <head> </head> <body> <h1>Braintree Credit Card Transaction Form</h1> <div> <form action="/create_transaction" method="POST" id="braintree-payment-form"> <p> <label>Card Number</label> <input type="text" size="20" autocomplete="off" data-encrypted-name="number" /> </p> <p> <label>CVV</label> <input type="text" size="4" autocomplete="off" data-encrypted-name="cvv" /> </p> <p> <label>Expiration (MM/YYYY)</label> <input type="text" size="2" data-encrypted-name="month" /> / <input type="text" size="4" data-encrypted-name="year" /> </p> <input type="submit" id="submit" /> </form> </div> <script src="https://js.braintreegateway.com/v1/braintree.js"></script> <script> var braintree = Braintree.create("YourClientSideEncryptionKey"); braintree.onSubmitEncryptForm('braintree-payment-form'); </script> </body> </html>
Once your form is setup you can use one of our 7 server-side client libraries to create transactions or customers using the encrypted data from your form.
We provide the latest backwards compatible version at the URL below.
Current version: 1.3.10. Released June 23, 2014.
For details on changes see the change log.