Hosted Fields
Hosted Fields is a way to accept credit card payments securely using our JavaScript SDK, while staying in control of the style of your desktop and mobile website checkout UI.
Inputs for credit card data
Hosted Fields provides custom iframes for collecting certain sensitive payment fields, which are rendered as inputs directly onto your checkout page.
See the examples
Securely-hosted credit card data
Use Hosted Fields to remain eligible for SAQ A PCI compliance.
Your customized look and feel
Style your checkout form according to your specific brand guidelines.
Card-specific form events
Check for valid credit card inputs and update your UI accordingly.
Hosted Fields and your server
Data collected using Hosted Fields is sent directly from your client to Braintree, so your customers' raw payment information never touches your server.
Braintree associates that data with a secure, one-time-use string called a payment method nonce, which is used instead.
This exchange helps safeguard your customers' card data – and helps keep your PCI compliance scope to a minimum.
Integrate Hosted Fields
Step-by-step
- Set up your server with one of our server SDKs in the language of your choice.
- Set up your web client with our JavaScript SDK, then add Hosted Fields .
- Consider adding other payment methods to complete your integration.
- If needed, set up your iOS and Android clients using our mobile SDKs.
Want to dig deeper? Our JavaScript v3 client reference has all the details.
If you're looking for a pre-formatted form to start accepting payments on mobile and web, consider reading about the Drop-in UI, the quickest way to get set up with Braintree.