Checkout.js SDK

If you want an easy way to accelerate and enhance your API integration, try our Checkout.js SDK.

Alpha version

This feature is subject to breaking changes at any time.

What problems are solved?

When using the REST API to start a GunTab transaction, you generally open the GunTab checkout page in a new window. Then, once the checkout is complete, GunTab can redirect the buyer back to your website as instructed. However, that requires you to write your own code, and leaves your original/outdated window open after buyer checkout is complete.

Our Javascript SDK equips you with pre-written code and an elegant, controllable user experience for your buyers.

How it works

The Javascript SDK should be implemented to facilitate your buyer checkout flow:

  1. You use the REST API to generate a transaction ID.
  2. You invoke the Checkout.js SDK and pass the transaction ID.
  3. The Checkout.js SDK puts a gray overlay on your window, and opens a popup window for the buyer to checkout.
  4. When the buyer checkout ends, the Javascript SDK closes the checkout window, removes the gray overlay on your window, and returns the checkout_state via JS.
  5. Before considering a transaction canceled/pending/succeeded, your app should perform a server-side call to the REST API to confirm.

Script

Load the GunTab class like this: 

  
<script src="https://www.guntab.com/sdks/checkout.js"></script>

Usage

The GunTab class has one method: startBuyerCheckout. This method has two arguments:

  1. transactionId (required): The Invoice/Transaction ID generated via the REST API.
  2. timeoutSeconds (optional, defaults to 0): The number of seconds before the promise will return a checkout_state of checkout_timeout. Set to 0 for unlimited time.

The startBuyerCheckout method returns a promise, which resolves with a checkout_state value. The possible values are:

Example

  
<script src="https://www.guntab.com/sdks/checkout.js"></script>

<script>
  function openGunTabBuyerCheckoutWindow() {
    const guntab = new GunTab();
    guntab.startBuyerCheckout('55555555-5555-5555-5555-555555555555', 1800)
    .then((checkout_state) => {
      // Redirect to the next step, which calls the REST API to confirm
    })
    .catch((error) => {
      console.error("Error:", error.message);
    });
  };
</script>

<button onclick="openGunTabBuyerCheckoutWindow()">Pay with GunTab</button>

Security warning

Do not rely on any values originating in your client-side Javascript, because that environment cannot be trusted. Instead, confirm server-side via the REST API.

Frequently asked questions