DEV Community

Dapo Adewuyi
Dapo Adewuyi

Posted on

Team Helsinki Flutterwave Experience

Flutterwave is a payment platform for an individual or business to receive payments on their website. For Team Helsinki web app; TaxItNG, we integrated Flutterwave so as to receive payments of taxes.

Integrating Flutterwave is quite easy. For a newbie, you need to read up on the documentation. The first step is to open a Flutterwave account called Rave.

On opening a Rave account, you are redirected to your Rave dashboard. You also have API keys generated when you do. Theses APIs keys are three(3). They are a public key, a secret key, and an encrypted key. The public keys are what you use on your website and it is used to identify your account with Rave and is needed to create a transaction. Your secret keys should be kept confidential. It can perform API requests to Rave without restrictions. The encrypted keys are used in mobile integrations where storing the secret keys are not allowed as they must be displayed.

You can access your API keys by going to the settings on your dashboard. Under settings, choose API and your API keys will be revealed.

When you open a rave account, there are two modes. The live mode and test mode. The test mode is to help test your codes and integration to know if your payments work as they should. On the live mode, that is where actual transactions occur when your clients/customers pay. When using the test mode, Rave provides you with test cards, test bank accounts and credentials to make a transaction.

When all these are done, now is the time to integrate Rave into your website. Rave has different plugins and libraries for different platforms to make integration easier and faster. If you do not want to use the plugins you can do ahead.

we embedded the Rave button by using the inline JS. You do this by copying the inline JS script provided and pasting in your webpage then change the default API keys to your own API keys. You get your API keys as discussed above. You then create a unique transaction reference txRef by changing the default value in the script you copied.

To test your integration, use the test cards and test bank accounts provided by Rave. Lastly, you verify the transaction after collecting payment.

In integrating Rave inline, two errors were encountered. One was the Invalid Public Key error. To avoid this, you must be conscious of your mode if it is either a test mode or a live mode. Using the public keys for a live mode on a test mode will not work or vice versa rather will throw the invalid public key error. Secondly, the Bad Integrity hash error was also encountered. The integrity hash feature requires that the amount you hashed on your server is the same amount you are passing to the paybutton, if it's different on loading the modal the Bad Integrity hash error occurs. So you need to be conscious of this.

All in all, it was a great learning experience. As a recap, here are the steps to integrate Flutterwave into your website

  1. Open a rave account
  2. Get your Public API Key(PB)
  3. Be conscious of the mode you do get your API keys and when integrating
  4. Use whichever plugins apply to you or get the inline Rave JS and copy on your webpage. Change the default Public Key, to your own. Also, change the transaction reference txRef.
  5. Test your integration and fix whatever errors encountered.

Top comments (0)