@comgate/checkout-js-dev NPM

@comgate/checkout-js

NPM version

@comgate/checkout-js is a JavaScript library for easily implement Comgate payment methods directly into the online store cart. It allows you to create a clean, non-disruptive design, including the payment processing through our systems.

Difference between `@comgate/checkout-js` and `@comgate/checkout`.

@comgate/checkout-js is loading wrapper and TypeScript types for @comgate/checkout.

The @comgate/checkout package is currently deprecated, and all its functionality has been moved to this library.

Comgate Checkout SDK documentation

Comprehensive API documentation can be found on our website. It is used for custom implementation of e-shop connection to API. It contains CURL, PHP, JAVA, Python and C# examples.

The complete documentation for this library is available in our API documentation, in the Checkout Library section.

Why use @comgate/checkout-js?

In a standard case, you have to insert a script into the page, wait for it to load, catch any error and only then start using the available functionality.

This is a snippet of how to load the Comgate Checkout SDK in non-blocking way without this library:

<!-- Loading Comgate Checkout SDK version 1.x.y in a non-blocking way -->
<script src="https://static.comgate.cz/checkout/@1" onerror="onError()" onload="onLoad()" defer></script>

<script>
    let timeoutId = undefined;

    // check if the script is loaded and executed
    document.addEventListener('ComgateCheckoutReady', function () {
        clearTimeout(timeoutId);
        // ready to run Checkout SDK
    });

    // needed if the script is loaded but not executed
    function onLoad() {
        timeoutId = setTimeout(() => {
            if (window?.COMGATE_SDK) {
                // ready to run Checkout SDK
            } else {
                onError();
            }
        }, 500);
    }

    // script loading error
    function onError() {
        // script loading error
    }
</script>

The @comgate/checkout-js library wrapping all this logic in a non-blocking way for you.

Installation

To get started, install @comgate/checkout-js with npm.

npm install @comgate/checkout-js

Usage

Import the loadComgateCheckout function for asynchronously loading the Comgate Checkout. Then it is possible to create an instance of Comgate Checkout by general documentation for this library.

`loadComgateCheckout(options)`

accepts an object with options
returns a Promise that resolves when the Comgate Checkout SDK is loaded

Promises

import loadComgateCheckout from '@comgate/checkout-js';

const checkoutId = 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx';

loadComgateCheckout({ checkoutId /*, version: '@1', async: true, defer: false*/ })
    .then((res /*: TComgateCheckoutLoadResult*/) => {
        // Comgate Checkout SDK loaded
        //
        // res contains: 
        // {
        //   checkoutId: string;
        //   ComgateCheckout: Function,
        //   ComgateCheckoutVersion: Function,
        //   ComgateCheckoutMethodList: Function
        // }
    })
    .catch((error) => {
        console.error('Comgate Checkout SDK loading error', error);
    });

import loadComgateCheckout from '@comgate/checkout-js';

const checkoutId = 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx';

let comgateCheckout;

try {
    comgateCheckout = await loadComgateCheckout({ checkoutId /*, version: '@1', async: true, defer: false*/ }); 
} catch (error) {
    console.error('Comgate Checkout SDK loading error', error);
}

if(comgateCheckout) {
    // comgateCheckout contains: 
    // {
    //   checkoutId: string;
    //   ComgateCheckout: Function,
    //   ComgateCheckoutVersion: Function,
    //   ComgateCheckoutMethodList: Function
    // }
}

Passing options

Using a CDN

Usage

Import the loadComgateCheckout function for asynchronously loading the Comgate Checkout JS SDK.

`loadComgateCheckout(options)`

Async/Await

Promises

Passing options

Using a CDN

import loadComgateCheckout, { getLoaderVersion, checkoutVersions } from './src';
// import {TEventComgateCheckoutReadyDetails} from "@/checkout-types/types";

// Check version of SDK loader for NPM
console.log(`Using Comgate Checkout Loader v${getLoaderVersion()?.version} (@comgate/checkout-js).`);

// get SDK available versions
console.log('Available Comgate Checkout SDK versions:', checkoutVersions);

// using default version '@1'
loadComgateCheckout(/*{ version: '@1' }*/)
    // need to wait to promise resolve - SDK is loaded
    .then((res /*: TEventComgateCheckoutReadyDetails*/) => {
        // SDK is loaded and ready to use

        // Comgate Checkout SDK init function is available in
        // A)
        //      window.COMGATE_SDK({ /* options */ }); // returns Promise
        // B)
        //      res.ComgateCheckout({/* options */ }); // returns Promise

        // Comgate Checkout SDK Version function is available in
        // A)
        //      window.COMGATE_SDK_VERSION(); // returns Object
        // B)
        //      res.ComgateCheckoutVersion(); // returns Object

        // Comgate Checkout SDK Method List function is available in
        // A)
        //      window.COMGATE_SDK_METHOD_LIST({/* options */ }); // returns Promise
        // B)
        //      res.ComgateCheckoutMethodList({/* options */ }); // returns Promise

        console.log(`Comgage Checkout SDK loaded (${res.ComgateCheckoutVersion()?.version} == ${window?.COMGATE_SDK_VERSION()?.version}).`);
    })
    .catch((error) => {
        console.error('Comgate Checkout SDK loading error', error);
    });