Before you get started with the hosted payment page, there are a couple of steps to cover first.
- Set up payments in your Console account, and ensure you've set a
redirect_uri. Your user is redirected back to your website or application at the end of the payment journey and this
redirect_uridefines where they are redirected to.
- Set up your integration with Payments API v3. You don't need to consume all of the Payments API endpoints, but you do need to be able to either create a payment or create a variable recurring payment mandate, and then register for webhook notifications to consume the result.
After creating a payment or VRP through the Payments API, you can build a hosted payment page URL for the transaction. The URL should include the following hash parameters:
|Returned by Payments API on payment creation or mandate creation.||Yes|
|Returned on payment creation.||Yes|
|Where the user is redirected when they exit the payment flow. This should match one of the entries you've added to your ||Yes|
To build the URL, substitute these parameters for the text and enclosing curly brackets in the URL below:
For VRP mandates:
For VRP mandates:
Here is an example of a hosted payment page link built correctly:
Direct your user to the hosted payment page URL you've just built.
Typically, you direct your users to the hosted payment page through a button in your app named Instant Bank Transfer. Learn more about how to design your user experience and interface.
After the user has successfully authorised their payment they are redirected to the
return_uri specified in your hosted payment page URL. The
payment_id is appended as a query parameter to your
If your user chooses not to complete the payment and cancels on the hosted payment page, then an extra error query parameter is appended, containing
In order to communicate the payment result to your user, you can retrieve the payment status via webhooks notifications.
Updated 15 days ago