Integrating checkout via Web SDK

To integrate XBD Checkout into your store, follow these steps.

Prerequisites

XBD will provide you with the following details necessary for order creation to function, which must be kept confidential on your side:

  • Pos Client ID
  • Pos Client Secret

Sandbox URL : https://pay-sandbox.xbase.digital/
Production URL : https://pay.xbase.digital/

Integration Steps

Step 1. Install the package %PACKAGE_NAME% Add the libary at the root of the app. For example main.tsx

import { initGlobalSdk } from '../sdk/checkout-sdk.es';

window.MyCheckoutSDK = initGlobalSdk({
  "grant_type" : "client_credentials",
  "client_id" : <POS Client Id which you received from XBD >,
  "client_secret" : <POS Client Secret which you received from XBD >
  "merchantLocationId" : <Merchant Location Id which will be provided by XBD>,
});

Step 2. On Checkout call the checkout method.

 const checkoutResponse =  await window.MyCheckoutSDK.checkout({
      "merchantLocationId" : <Merchant Location Id which will be provided by XBD>,
      "merchantOrderId" : <Order ID which you will generate from your side>,
      "title" : <Your Business Name>,
      "description" : <Description of the Cart>,
      "amount" : <Cart Amount>,
      "currency" : <Currency of the Cart>,
      "email" : <Customer Email ID>,
      "acceptUrl" : <Your Accept Url>,
      "cancelUrl" : <Your Cancel Url>,
      "callbackUrl" : <Your Callback Url>,
  });

You will receive a paymentRedirectUrl in the response, which you need to redirect the user to.

With this paymentRedirectUrl, your store will be navigated to our Checkout solution which will further process the order and receive the payment.

Demo