Redirect Checkout

The Redirect Checkout is very similar to Simple Checkout, but instead of opening an overlay on your website, the user is directed to a special payment page hosted by Viva Wallet. Once the user completes a purchase, they are redirected back to a success page of your choice. It involves minimal technical effort on your side and offers the widest variety of payment options.

Redirect Checkout


Prerequisites

  1. Log in to the Viva Wallet banking app, demo or live .
  2. Create a payment source selecting Redirection/Native Checkout v2 as the integration method.

The demo environment has a base URL of https://demo.vivapayments.com/ and for the live environment it’s https://www.vivapayments.com/.


Setup instructions

Redirect checkout is a simple three-step process, where you create the payment order, redirect the customer to the Viva Wallet Payment gateway then confirm the transaction.

Step 1: Create the payment order

A payment order is created every time you want to tell Viva Wallet that you require a certain amount of money from one of your customers. Think of it as a utility bill. You give Viva an order to issue a bill on your behalf. The bill is then sent to your customer and they have to pay a specific amount within a given period of time. Each Payment Order has a unique 12-digit ID also referred to as the payment code.

POST /api/ordersCreate payment order

To remove an existing payment order, use DELETE /api/orders/{id} – Cancel payment order

Step 2: Complete payment details (redirect)

After creating the payment order, redirect the customer to the Viva Wallet checkout page:

/web/checkout?ref={OrderCode}

Where {OrderCode} is the payment order created in the previous step. Here, the customer will see the checkout form where they can enter their name, card number and all other necessary information to complete the transaction.

To simulate a successful payment on the demo environment, use the card number 4111111111111111 with any valid date and 111 for the CVV2.

Step 3: Confirm the transaction

After completing the checkout form, the customer is redirected back to your website. The redirection URLs are defined in your Viva Wallet banking app under the payment sources for your website / app.

If you have defined multiple sources on your profile, you need to use the optional SourceCode parameter when creating the payment order, so that the system selects the appropriate redirection URL.

The redirection uses the HTTP GET method and may append the following parameters to the URL:

Try to verify the status of a transaction and not blindly depend on whether your success or failure URL is called. You can make a call to retrieve transactions in order to verify the status of an order. To get notified for offline payment methods you can make use of the webhooks notification service.