Embedded Checkout

POST https://sandbox-checkout.payjustnow.io/v2/create

For embedding a checkout within an iFrame or using inside a WebView the following steps need to be taken.

Step 1 (Implement Create Checkout)

The create checkout API must be fully implemented.

Step 2 (Request Embedded Checkout Enabled)

Your assigned Merchant Account ID needs to be enabled by PayJustNow support to allow for embedded checkout.

Please reach out to your account manager to action this step.

Step 3 (Set checkout type to embedded)

Pass "checkoutType": "embedded" in the checkout request payload.

Step 4 (use returned payment url inside iframe or webview)

On a successful checkout you can then use the returned paymentUrl inside an iFrame or WebView.

10 minute duration

For security reasons, the paymentUrl is only valid for 10 minutes and this cannot be changed.

Step 5 (listen for redirects)

Listen for redirects to end the embedded journey.

If the consumer successfully makes the payment they will be redirected back to the confirmRedirectUrl you supplied in the checkout request.

If the consumer decides to cancel making payment they will be redirected back to the cancelRedirectUrl you supplied in the checkout request.

tip

For finer-grained control, you can also listen for the following postMessage events coming back from the embedded app to your host.

window.addEventListener('message', (e) => { 
  const {event, checkoutId, payload} = e.data; 
  switch (event) { 
    case 'checkout:loading’: 
      console.log ('Checkout is loading); 
      break; 
    case 'checkout:ready’: 
      console.log (`Checkout is ready`); 
      break; 
    case 'checkout:cancelled': 
      console.log ('Checkout cancelled:', payload.reason); 
      break; 
    case 'checkout:paymentsuccess': 
      console.log ('Checkout payment success:', payload.reason); 
      break; 
    } });