Install Braintree SDK
- Ensure your project is set up with Node.js and add the Braintree SDK to your project by using npm.
npm install braintree
Initialize Braintree Gateway
- In your Node.js application, you'll need to require the Braintree package and initialize your Braintree gateway with your credentials.
const braintree = require('braintree');
const gateway = new braintree.BraintreeGateway({
environment: braintree.Environment.Sandbox, // Change to Production when ready
merchantId: 'your_merchant_id',
publicKey: 'your_public_key',
privateKey: 'your_private_key'
});
Generate a Client Token
- The client token is a credential that allows the Braintree client SDK to connect to the gateway client-side. Typically, you generate a client token server-side and send it to the client.
app.get('/client_token', (req, res) => {
gateway.clientToken.generate({}, (err, response) => {
if (err) {
return res.status(500).send(err);
}
res.send(response.clientToken);
});
});
Implement Checkout on Client Side
- On the client side, use the Braintree JavaScript SDK to allow users to enter their payment information securely. Use the client token to integrate Drop-in UI or Hosted Fields.
<script src="https://js.braintreegateway.com/web/dropin/1.32.1/js/dropin.min.js"></script>
<div id="dropin-container"></div>
<button id="submit-button">Pay</button>
<script>
const form = document.querySelector('#payment-form');
braintree.dropin.create({
authorization: 'YOUR_CLIENT_TOKEN', // Replace this with actual client token from server
container: '#dropin-container'
}, (createErr, instance) => {
const button = document.querySelector('#submit-button');
button.addEventListener('click', (event) => {
event.preventDefault();
instance.requestPaymentMethod((err, payload) => {
// Send payload.nonce to your server
});
});
});
</script>
Process Payment on Server Side
- Once you have obtained the payment nonce from the client side, send it to your server and use it to process the payment using Braintree's SDK.
app.post('/checkout', (req, res) => {
const nonceFromTheClient = req.body.paymentMethodNonce;
const amount = req.body.amount; // Amount should come from the client
gateway.transaction.sale({
amount: amount,
paymentMethodNonce: nonceFromTheClient,
options: {
submitForSettlement: true
}
}, (err, result) => {
if (err) {
return res.status(500).send(err);
}
if (result.success) {
res.send(result);
} else {
res.status(500).send(result);
}
});
});
Handle Errors and Webhook Events
- Implement comprehensive error handling to manage any issues during the creation of transactions. Consider setting up webhooks to handle asynchronous events like transaction settlements, chargebacks, or subscription changes.
app.post('/webhooks', (req, res) => {
gateway.webhookNotification.parse(
req.body.bt_signature,
req.body.bt_payload,
(err, webhookNotification) => {
if (err) {
return res.status(500).send(err);
}
console.log(webhookNotification.kind); // Handle different webhook notification kinds
res.status(200).send("Webhook Processed");
}
);
});
Additional Security Measures
- Ensure all communication between the client and your server is secured over HTTPS.
- Adhere to PCI compliance guidelines when handling payment information.
