Here’s an example of how you’d implement HTML checkout:
Let’s take a closer look at what this code is doing.
First, we create a regular HTML form. The form must have the
POST, and the
action pointing to Chapa’s hosted checkout page.
Second up is setting the your public api key. You can get your public api key from your dashboard after signing up. Here is a link on how you can get it.
Next up is the payment button. This is the button the customer clicks after they’ve reviewed their order and are ready to pay you. Make sure it’s inside the form and set to
type="submit" so the form submits when it’s clicked.
Finally, we add hidden input fields to the form containing the payment options. These payment options are the same values used in the Standard flows, converted into form fields. Object fields are referenced with square brackets.
On your server, you should handle the redirect and always verify the final state of the transaction.
Transaction verification should always be done on the server, as it makes use of your secret key, which should never be exposed publicly.
What if the payment fails?
If the payment attempt fails (for instance, due to insufficient funds), you don’t need to do anything. We’ll keep the payment page open, so the customer can try again until the payment succeeds or they choose to cancel.