Quick start guide
This page demonstrates the basic usage of PayNow Component SDK.
Installation
To install PayNow Component, include the library in your HTML head.
<head>
...
<script src="https://js.paynow.com.tw/sdk/v2/index.js"></script>
</head>Initialization
Before starting, you need to use the PayNow API to exchange the private key provided by PayNow 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 transaction secret. more
PayNow.createPayment({
publicKey: 'YOUR_PUBLIC_KEY_IN_PAYNOW',
secret: 'SECRET_OF_YOUR_TRANSACTION'
})Mounting the Payment Form
To mount the payment form, create an html element as container.
<div id="paynow-container"></div>Then, mount the payment form to the container.
PayNow.mount('#paynow-container')Checkout
Finally, you can start accepting payments by calling the checkout method.
<div id="paynow-container"></div>
<button id="checkout-button">Checkout</button>const checkoutButton = document.getElementById('checkout-button') as HTMLButtonElement
checkoutButton.addEventListener('click', () => {
PayNow.checkout().then((response: CheckoutResponse) => {
// handle checkout response
})
})