Our PayNow Component renders PayNow in your payment form.
Before you begin
This page explains how to add PayNow to your existing iOS Components integration. The iOS Components integration works the same way for all payment methods. If you haven't done this integration yet, refer to our Components integration guide.
Before starting your PayNow integration:
- Make sure that you have set up your back end implementation for making API requests.
- Contact our Support Team to enable PayNow.
Show PayNow in your payment form
Include PayNow in the list of available payment methods.
-
Specify in your /paymentMethods request:
- countryCode: SG
- amount.currency: SGD
- channel: Specify iOS
-
Decode the
/paymentMethods
response with thePaymentMethods
structure.let paymentMethods = try JSONDecoder().decode(PaymentMethods.self, from: paymentMethodsResponse)
Find
paymentMethods.type
paynow and put it into an object. For example,paynowPaymentMethod
. -
Create an instance of
APIContext
with the following parameters:
Parameter name | Required | Description |
---|---|---|
clientKey |
![]() |
Your client key. |
environment |
![]() |
Use test. When you're ready to accept live payments, change the value to one of our live environments. |
- Initialize the PayNow Component:
let paynowComponent = paynowComponent(paymentMethod: paynowPaymentMethod, apiContext: apiContext) paynowComponent.delegate = self // In this example, the Pay button will show 10 SGD. // The value is in minor units. Change the currencyCode to the currency for the PayNow Component. paynowComponent.payment = Payment(amount: Amount(value: 1000, currencyCode: "SGD")) present(paynowComponent.viewController, animated: true)
Make a payment
When the shopper proceeds to pay, the Component invokes the didSubmit
method containing the data.paymentMethod
from the PaymentComponentDelegate
.
- Pass the
data.paymentMethod
to your server. -
From your server, make a /payments request, specifying
paymentMethod.type
: thedata.paymentMethod
from your client app.The response contains the following data:
resultCode
: Pendingaction
: Contains the QR codeqrCodeData
.
Show the QR code
Use the information in the action
object of the /payments response to render the QR code:
action.qrCodeData
: Use this to render the QR code on your checkout page.
The shopper can either scan the QR code, or take a screenshot of the QR code and upload it to their bank app.
Test and go live
Test PayNow payments with real payment details and small amounts.
Check the status of your test PayNow payments in your Customer Area > Transactions > Payments.
To accept live payments, you must contact our Support Team to add in your live Customer Area.