Buxter architecture overview

Suppose you've produced a Facebook App - the next Farmville perhaps and now you want to sell virtual goods. Or maybe you want to sell your band's songs. No matter what you are trying to sell, it’s important that you can offer users an easy way to pay for your products. 

Buxter, ClickandBuy's new Facebook application, is one of the easiest and most secure ways to transfer money. In the picture below you can see how simple it is for Facebook users to purchase items with Buxter.

There is no need to sign up for a special payment system over and over again. You just log into Facebook, access your wallet (which of course is secured), make your purchase and go back to the shop again.   

Since your payment data is stored with Buxter you don’t have to show your payment details to online merchants. This strengthens consumer trust. It's a kind of safe haven where you can shop without having to worry about the potential theft of a user’s payment details.

But how does it all work from a technical perspective? Let me explain by showing you a simplified sequence diagram. To keep things easy the diagram is not worked up too close to UML spec but I think it gets the point across. I know sequence diagrams are not exactly easy on the eyes, but bear with me on this one. I'll take you through it...

1. The second a user clicks an a "Purchase through Buxter" link he sends a call to the Facebook app
2. The Facebook app then prepares an inventory of the products that will be presented to the user for purchasing. Parameters like price and various internal details are assembled and passed to the CreateTransaction() call of the Buxter API.
3. Buxter then creates a new transaction that corresponds to the purchasing process of this particular User.
4. A redirect link is generated and transferred to the Facebook app.
5. The Browser is redirected
6. A payment dialogue appears on the page the user sees. This dialogue is accepted by the user, thus, the payment is confirmed
7. Buxter tries to clear funds from the account
8. If the payment succeeds the transaction status is set to 'success', if the payment is unsuccessful a range of error states are used
9. The user is then redirected to the page in the third party app that accepts post payment information (for example through the external id that is passed as a parameter)
10. The browser requests the post purchase page
11. The facebook app calls the GetTransactionStatus() method 
12. The status information of the Transacation is delivered to the facebook app
13. The facebook app then makes decisions based on the status information whether the purchase was made successfully

And that’s it. We have gone through all the details behind the scenes which are necessary to successfully make a purchase on a third party app in Facebook. 

Please note that we only made two calls in our facebook app layer. This means ultimate ease of use from the developer perspective. So that’s all for now. Have fun with Buxter.