XCentium Launches Braintree Plugin for Sitecore OrderCloud
Reach more buyers and drive higher conversion
With Sitecore's acquisition of OrderCloud B2B e-commerce platform comes a host of opportunities to create great customer experiences in new business domains. As its name suggests, Sitecore OrderCloud is a cloud-based offering. It's API-first, headless architecture and extensibility focused design make it an idea candidate for integration with the Sitecore XP. Being extensibility-focused also means plugins (or integrations in OrderCloud s terminology) will need to be written to fully leverage the platform. To this end, XCentium has developed an integration for Sitecore OrderCloud platform with Braintree , a best-in-class payment gateway from PayPal that should be familiar to developers that have worked with Sitecore Experience Commerce . Braintree's wide range of payment types (credit cards, digital wallets, ACH, etc.), extensive documentation, and easy sandbox account creation make it a perfect choice for integrating with Sitecore OrderCloud.
Braintree Integration Highlights:
- Supports Braintree's web client-based payment method nonces for no-hassle PCI compliance
- Maps OrderCloud buyers, credit cards, and payment entities to Braintree vault/payment methods and transactions
- Uses OrderCloud webhooks to enable customer-specific requirements for settlement
To develop this integration I had to take care of some prerequisites
- Get a free Braintree Sandbox Account
- Get an OrderCloud Account + populate it with commerce data.
- Create a free ngrok Account
- Fork the OrderCloud headstart SDK
Then I performed the following steps,
- First, I installed the Braintree server SDK on the headstart middleware application
- Created an endpoint to generate a Braintree client token on the headstart middleware application
- Installed the npm Braintree drop-in UI in the headstart angular application with types courtesy of @types/braintree-web-dropin
- Added an angular component to call the Braintree drop-in UI with hooks to pass the payment method nonce back to the headstart middleware application
- Added a Braintree integration project modeled and built out the required functionality
- Create Customer
- Add Payment Method
- Authorize Sale
- Settle Transaction
- Configured ngrok to route webhook requests to my local machine for testing purposes
- Create a webhook in the Sitecore OrderCloud portal that calls my middleware service after the order is submitted and then settles the payment with Braintree.
- This can also be done before submitting the order using a pre-hook or after the order is shipped based on business requirements.
References: