Real-time financial transactions with Fidel and Webhooks

Fidel makes it easy to innovate with financial transaction data. It works like this: we’re integrated with the card networks (Visa, Mastercard and Amex). You enrol your customers’ cards to your programs. When a transaction is made with an enrolled card, we spot it in real-time, and pass the transaction info to you. All of the compliance and security is handled on our end, so it’s super easy for you to start to innovate with the data.

One of the best things about the data is that it arrives in real-time. We securely tokenize the data before we send it to you, so all you have to do is pair the unique userId to your customer database. Then, you can see all your customers’ transactions in the Fidel dashboard as you refresh the page.

But no one wants to sit on a webpage and hit refresh to see results. What you want is to  receive this data in your infrastructure, so you can send your customer a text to say “thanks for joining”, or “thanks your purchase, you’ve just earned 10 loyalty points.”

The way to get notified in real-time about your users’ transactions is through the use of webhooks.  

What are webhooks?

Refreshing the page over and over is polling for data - you have to make a request for the data.  Webhooks push the data to notify your server as soon as an event occurs (just like your email and WhatsApp messages get pushed to your phone in real-time).

Let’s set up an example Fidel program and establish two webhooks: when a new card is linked, and when a linked card makes a transaction.

Web SDK setup

The Fidel WebSDK is used to enrol cards into your program.  It’s pretty easy to set up.  Just copy the code from the *index.html* into your webpage to build the Fidel dialogue. There are 3 required fields:

data-company-name="Your company"

data-key="pk_test_demo"

data-program-id="bca59bd9-171b-4d1f-92af-4b2b7305268a"

All the other fields can be modified as desired (to change colours, links and images). Here is a sample implementation, hosted on Glitch:

This implementation is in the test environment, so feel free to use any of the Fidel test card numbers (4444 0000 0000 4XXX for Visa,  5555 0000 0000 5XXX for Mastercard, or 3400 0000 0000 3XX for Amex), and add them to the service.  

Once you add a card, you can make a transaction to the program. It's all test money, so go right ahead!

Where are the transactions reported?

Now we have added a card and completed a transaction. Fidel has recorded it, and you can view the transaction in your dashboard. But we want to create the webhooks to immediately report this data. To establish a webhook, you can use the dashboard at:

https://dashboard.fidel.uk/webhooks,

or use our API:

https://reference.fidel.uk/reference#create-webhook-program

and add a webhook. You’ll need the Program (or programId), the event you want to track, and the endpoint where the data will be reported.

In this case, we’ll create two webhooks: for card enrolment and for transaction authorisation.

The URL that these are posting to is another Glitch demo. The demo receives the webhook, and posts some processed results on the website:

You should see the card you added, and the transaction you placed. If you’re really lucky, maybe another person reading this post also posted a card and transaction, which you’ll be able to see as well. Add another card to see how quickly the interactions are fed via the webhook to the receiving website.

How You can use Fidel’s webhooks

Imagine automated emails thanking your customers for enrolling in your loyalty program. Once they place an order, you can not only confirm the order based on the information from your website, but also notify them of rewards earned through your loyalty program.  You can also have a webhook to validate when authorised transactions have cleared.  The webhook from Fidel allows you to process your data in real-time – with that, you can start to build some really cool customer experiences.

Intrigued?  Login to your Fidel dashboard and set up a few webhooks to see how convenient they make processing your data in real-time.  Leave a comment in our community if you have any questions, or if you have a neat implementation you’d like to share.