Getting started with the Checkout API

Overview

OnlinePay Checkout is an end-to-end solution that supports accepting payments securely via our payment partner, Verifone. You can configure Checkout to accept card payments and alternative payment methods, such as Apple Pay and Google Pay through the same page. All you need to get started is access to your OnlinePay dashboard. For more information about getting started with OnlinePay, see Getting Started.

Requests to the Checkout API are made using REST API calls to the /checkout-service/v2/checkout endpoint using standard HTTP methods.

How does the Checkout work?

Checkout is a hosted solution, which means that the payment page is hosted by your bankand is displayed in an iFrame on your website or as a Hosted Payment Page(HPP). This ensures that the payment page is secure and PCI compliant. The payment page is fully customisable, allowing you to match the look and feel of your website.

Your OnlinePay Checkout can connect to an existing shopping cart application, with support for carts such as Shopify, WooCommerce, Magento, OpenCart, and PrestaShop.

The Checkout API provides greater control of the payment process, allowing you to customise the payment page, and integrate with your existing systems.

The Checkout is a pre-built payment page that you can integrate with your own online store or website to accept payments directly from your customers. These payments are processed by Westpac and are viewable in your OnlinePay dashboard. Payments can be either a one-off purchase for a specific item or service, or may be an ongoing subscription or payment plan.

To create your checkout using the Checkout API, you will need a OnlinePay user with one of the following roles assigned to it:

Merchant Supervisor
Merchant Cashier

Set up your Checkout using the Checkout API, customise the theme to match your own branding, then integrate with your website or online store as either a HPP or iFrame.

Use the Checkout API to create a checkout

Checkout Hosted Payments Page (HPP)

The Hosted Payments Page (HPP) is a secure payment page hosted by Westpac. Shoppers are redirected to the HPP to complete their payment. The shopping card details, products, and quantities are passed to the HPP via the Checkout API, and the shopper is redirected back to your website once the payment is complete.

You can indicate that your Checkout is a HPP by setting the interaction_type to HPP in your Checkout API request. If the interaction_type is not set, the default value is HPP. See Pay by link for more information.

The following API request body shows an example of how to set up a checkout with the interaction_type set to HPP:

{
    "entity_id": "{{entityId}}", //required.
    "currency_code": "{{currency}}", //required. AUD only.
    "amount": 1500, //amount in cents.
    "merchant_reference": "{{$guid}}", 
    "interaction_type": "HPP", //default value.
    "configurations": {
        "card": {
            "shopper_interaction": "ECOMMERCE",
            "payment_contract_id": "{{paymentContract}}"
        }
    }
}

A successful response to this request will return a URL that you can redirect your shoppers to in order to complete their payment.

{
    "id": "d23b7767-xxxx-xxxx-xxxx-xxxx876568aa",
    "url": "https://{{baseUrl}}/v2/checkout/d23b7767-xxxx-xxxx-xxxx-xxxx876568aa/view",
    "details": {}
}

Checkout iFrame

The iFrame solution allows you to embed the payment form in an iFrame, and is a good option if you want to keep shoppers on your website during the payment process. The form is still securely hosted by OnlinePay.

ℹ️
Using an iFrame for Apple Pay may provide a suboptimal customer checkout experience depending on the browser and device used. We recommend using the HPP for checkouts that offer Apple Pay as a payment method.

Using an iFrame for Apple Pay may provide a suboptimal customer checkout experience depending on the browser and device used. We recommend using the HPP for checkouts that offer Apple Pay as a payment method.

You can indicate that your Checkout is an iFrame integration by setting the interaction_type to IFRAME in your Checkout API request. If the interaction_type is not set, the default value is HPP. See Pay by link for more information.

The following API request body shows an example of how to set up a checkout with the interaction_type set to IFRAME:

{
    "entity_id": "{{entityId}}", //required.
    "currency_code": "{{currency}}", //required. AUD only.
    "amount": 1500,
    "merchant_reference": "{{$guid}}",
    "interaction_type": "IFRAME", //creates an iFrame for the payment form.
    "configurations": {
        "card": {
            "shopper_interaction": "ECOMMERCE",
            "payment_contract_id": "{{paymentContract}}"
        }
    }
}

A successful response to this request will return a URL that includes a JavaScript loader that you can use to embed the payment form in an iFrame on your website.

This can be injected into your website using a script tag inside the HTML where you want the payment form to appear.

For example:

<div id="payment-container">
    <script defer src="https://{{baseUrl}}/v2/loader.js?checkoutId=d23b7767-xxxx-xxxx-xxxx-xxxx876568aa"></script>
</div>