Event Listeners

7 min

Introduction

After completing transactions in Pay3 SDK UI, the Pay3 SDK publishes events to App.

pay3-sdk-transaction-status

This event is fired by Pay3 SDK in following scenario:

On completion of Checkout transaction triggered by pay3.openCheckout()

Payload

data (Type Object): Following keys are present in this object

status (Type string): The status can have one of these values - SUCCESS or ERROR or INITIATED.

message (Type string): User-friendly message returned after completion of the transaction.

orderId (Type string): Pay3 Order ID.

requestId (Type string): Unique id passed by App.

Register callback: pay3Pay.on()

This function registers a callback, which is invoked when the given event type is received from Pay3.

Parameter

eventName (Type string): Name of the event for which we want to register the callback

callbackFn (Type function): Callback function accepting a parameter payload.

function myListener(payload) => {
  if (payload.error) {
    console.log("Error during transaction ", payload);  
  } else {
    const { status, message, orderId, requestId } = payload.data;
    console.log("Received transaction response", { status, message, orderId, requestId });
  }
}

pay3Pay.on('pay3-sdk-transaction-status', myListener);

index.js

function myListener(payload) => {
  if (payload.error) {
    console.log("Error during transaction ", payload);  
  } else {
    const { status, message, orderId, requestId } = payload.data;
    console.log("Received transaction response", { status, message, orderId, requestId });
  }
}

pay3Pay.on('pay3-sdk-transaction-status', myListener);

Check if registered: pay3Pay.hasListeners()

This function returns true if the event already has a registered callback.

Parameter

eventName (Type string): Name of the event for which we want to test if the callback is registered.

Return (Type boolean)

const isRegistered = pay3Pay.hasListeners('pay3-sdk-transaction-status');

Unregister callback: pay3Pay.removeListener()

This function removes a function that is already registered as a callback. Input of this function needs to be the same as that was provided in pay3Pay.on function call.

Parameter

eventName (Type string): Name of the event for which we want to register the callback

callbackFn (Type function): Callback function accepting a parameter payload.

pay3Pay.removeListener('pay3-sdk-transaction-status', myListener);

Register callback in React Native using WebView

For React native with Javascript SDK, the Pay3 Payment publishes the events using window.ReactNativeWebView.postMessage(string payload). These events are available via onMessage handler of the WebView

<WebView
  source={{uri: <URL returned by openCheckout or openPayout>}}
  ...
  onMessage={(event) => {
    const data = JSON.parse(event.nativeEvent.data);
    alert(JSON.stringify(data));
  }}
/>

// Sample JSON object
{
    "type": "pay3-sdk-transaction",
    "data": {
        "message": "Transaction completed successfully",
        "requestId": "cebb18de-739d-432d-89ff-b0dc2677c891",
        "status": "SUCCESS",
        "orderId": "1f16294b-fa2b-4eec-b55d-7c6638eb76ed"
    }
}