API for Poq web checkout JavaScript library

This document contains the public-facing API of the Poq web checkout JavaScript library. It lists methods made available on window.PoqWebCheckout and details of the events that are sent between your web page and your Poq app.

Methods

PoqWebCheckout.options(options)

Provide an object to configure the web checkout bridge. Nested options are in dot notation.

NameTypeDefaultDescription
applePay.classNamestring'apple-pay-button'The class name to use for Apple Pay buttons.
applePay.containerClassNamestring'poq-apple-pay-container'The class name of the container to inject Apple Pay buttons into.
debugboolfalseRun the bridge in debug mode to test your use of Poq web checkout JS. It will display logs and mock the Apple Pay process.

PoqWebCheckout.send(eventName, payload?)

Sends an event to your Poq app.

order

Update the order object. This must be kept up to date if you are using Apple Pay.

total is required, other fields are optional. See Order schema below.

PoqWebCheckout.send('order', {
total: 13.0,
orderId: '0776620100',
subTotal: 10.0,
delivery: 5.0,
discount: 2.0,
currency: 'GBP'
});

paymentcompleted

Once the user has completed their transaction, tell your Poq app that the user has successfully placed an order. The payload must contain the final order object.

PoqWebCheckout.send('paymentcompleted', {
order: {
total: 13.0,
orderId: '0776620100',
subTotal: 10.0,
delivery: 5.0,
discount: 2.0,
currency: 'GBP'
}
});

error

You can send an error event, if there is an error processing the payment with your payment service provider, which will show an alert on your Poq app. This event will also hide the Apple Pay modal if active.

PoqWebCheckout.send('error', {
errorMessage: 'Payment failed. Please try again.'
});

closewebview

Close the WebView to allow the user to continue shopping in your Poq app.

PoqWebCheckout.send('closewebview');

PoqWebCheckout.on(eventName, callback)

Use this to receive events from your Poq app. The callback will be called when your Poq app sends the matching event name. See: Events.

PoqWebCheckout.on('applepayauthorized', paymentData => {
console.log(paymentData);
});

PoqWebCheckout.destroy()

Remove the bridge with your Poq app.

Events

Asynchronous events can occur during the web checkout process. Event names are lower case and the data payload is an object containing the appropriate structure.

Send

You can send the following events to your Poq app using PoqWebCheckout.send.

NameDescriptionPayload
paymentcompletedOnce the user has completed their transaction, tell your Poq app that the user has successfully placed an order.{ order }
applepayUsed automatically when a Poq Apple Pay button is clicked. Starts the Apple Pay process on iOS by sending the current order.{ order }
errorIf there is an error processing the payment with your payment service provider, you can show an alert on your Poq app. This event will also hide the Apple Pay modal if active.{ errorMessage }
closewebviewCloses the WebView to allow the user to continue shopping in your Poq app. If this is triggered before paymentcompleted, the customer is shown a confirmation popup asking if they are sure they want to close this view. To customise this behaviour, talk to your contact at Poq.

Receive

You can listen to following events from your Poq app using PoqWebCheckout.on.

NameDescriptionPayload
applepayauthorizedThe user has authorized the payment via Apple Pay.paymentData object from PKPaymentToken

Schemas

Order

FieldTypeRequired
totalfloat
orderIdstring
subTotalfloat
deliveryfloat
discountfloat
currencystring