Integration via postMessage

Communication through postMessage allows, for example, the integration of Aplazame’s checkout application in Android or iOS without the need for iframe. It is the same integration that our SDKs implement

To use postMessage, the following URL must be used:

https://checkout.aplazame.com/?order={{checkout_id}}&public-key=api_public_key&sandbox=true&post-message=true

Messages flow

document.addEventListener('message', function (e) {

  console.log('message:\n', e.data);
  // message:
  // {
  //   "aplazame": "checkout",
  //   "event": "get-checkout-data"
  // }

});

document.addEventListener('message', function (e) {

  e.source.postMessage({
    aplazame: 'checkout',
    event: 'checkout-data',
    data: {
      // ...
    }
  }, '*');

});

Checkout loaded

This event is triggered when the checkout is loaded in the iframe/webview

// Received message
{
  "aplazame": "checkout",
  "event": "checkout-ready"
}

Change of checkout status

This event is triggered when the checkout status changes (the checkout view remains open).

// Received message
{
  "aplazame": "checkout",
  "event": "status-change",
  "status": "success" // values: success, pending, ko
}

Result after the checkout closes

This event is triggered when the checkout has been closed

// Received message
{
  "aplazame": "checkout",
  "event": "close",
  "result": "success"  // values: success, pending, dismiss, ko
}