Sitemap
Business Beyond Cash — The Beyonic Blog Archive

Thoughts & Updates From Beyonic — Archive

How to use QR codes & MPESA for fast payments in your merchant application

--

This is part 1 of a 3 part series on enabling instant payments with tools like QR Code, ChatBots and NFC to integrate payment services on your merchant application.

On the first part of this series we are going to integrate QR code payments. The goal of this part is to allow customers to pay a merchant by simply scanning a QR code on the merchant’s application.

The code consists of a Django backend, and an Android client which represents the user paying via QR code.

First we have two simple models:
1). The SpaceShip model is an example of a merchant product. Yes, our merchant sells space ships via MPESA.
2). The Payment model is used to hold payment information. There’s an on create signal to handle the actual payment process via the provider’s API

When a payment object is created a post save signal handles the API call to the payment provider. Our merchant is integrated with Beyonic which provides simple REST APIs connected to multiple mobile payment platforms across different countries.

And then we have simple views to do three things:
1. List the SpaceShips
2. Create a new payment from the QR code reader app’s request
3. A callback view that handles the response of the payment processing from our provider

To actually display the QR codes on the website we use this neat Django QR code package. And then the list view template looks as below

That is it for backend!

For the Android client all we want is for the user to scan a QR code, enter phone number and submit. After which the user gets a USSD popup from the network to complete the payment by entering their PIN.

Currently the layout is shown below with a button to initialize the BarCode scanner, an input field for the customer’s phone number from which the payment will be made and a button to start the payment process.

The scanner uses Google’s Mobile Vision APIs and our client is based on Varvet’s implementation.

The user will get a USSD popup on their phone to complete the payment

Of course there are many areas to improve on. For example you could use Django REST Framework to apify the server and secure the communication with an API token.

The full source code is available here for the server and here for the client. Feel free to chip in and submit a pull request.

--

--

Nick Hargreaves
Nick Hargreaves

Written by Nick Hargreaves

Just a mad man attempting hard things. FinTech | Cautiously optimistic about AI | Hiker | Runner | Coding & Engineering Management | #TeamLH

Responses (1)