OwlPay DocsPricingContact us
Guides
Get an API Key

Merchant acquiring solutions

Suggest Edits

Supported countries/regions: HK

📘

What you'll learn

If your e-commerce platform has payment collection needs, you can use this article to quickly connect your website.

OwlPay provides 2 ways for you to quickly collect payments from consumers through OwlPay.

  1. OwlPay Component
  2. OwlPay Tunnel API (Coming soon)

Life Cycle

OwlPay Component

  1. Create Application (Merchant) on OwlPay.
  2. Create and get your API Key & Public Key on API Key .
  3. Include the JS SDK in the HTML head section.
<head>
  <script src="https://js.owlpay.com/sdk/v2/index.js"></script>
</head>
  1. Before starting, you need to use the OwlPay API to exchange the private key provided by OwlPay and the transaction information for the secret key specific to that transaction. After obtaining the secret, input the public key and the transaction secret into the SDK to generate the payment instance for that transaction, and proceed with the subsequent operations.

📘

How to get transaction secret?

Create a payment intent to get your secret.

OwlPay.createPayment({
  publicKey: 'YOUR_PUBLIC_KEY_IN_OWLPAY',
  secret: 'YOUR_PAYMENT_INTENT_SECRET'
})
  1. To mount the payment form, create an HTML element as a container.
<div id="owlpay-container"></div>
  1. Then, mount the payment form to the container.
OwlPay.mount('#owlpay-container')
  1. Checkout, Finally, you can start accepting payments by calling the checkout method.
<div id="owlpay-container"></div>
<button id="checkout-button">Checkout</button>

const checkoutButton = document.getElementById('checkout-button')
checkoutButton.addEventListener('click', () => {
  PayNow.checkout().then((response) => {
    // handle checkout response
  })
})

OwlPay Tunnel API (Coming soon)


Webhook

When OwlPay receives certain events, we will trigger a webhook to the specific URL you provide for your system. This will allow your system to receive real-time information automatically without the need for manual checks.

You can see more information on Webhook.


Demo resource

You can visit our GitHub. Through quick teaching, we believe you can understand it very quickly.

Updated about 1 month ago