Collect.js

Collect.js enables you to embed Collect's checkout into your web application, allowing your users to choose their preferred payment method and be redirected to its authorization process without needing to go into Collect's hosted checkout.

How to implement Collect.js
Collect.js is a library for implementing the Collect widget - the Collect widget is a safe and secure web drop-in module that provides a simple interface for users to select their preferred payment method during checkout.

Before getting started

• Retrieve your Client Public API Keys.
• Create a sandbox customer, so you can get connecting immediately.

Installing
Using npm:

$ npm install collect-widget-js

Using yarn:

$ yarn add collect-widget-js

Using CDN:

<script src="https://cdn.collect.africa/collect-widget.js"></script>

Usage
For JS frameworks, import it and use;

import CollectWidget from 'collect-widget-js';

For others, just use;

import CollectCheckoutService from 'collect-africa-js'
      const checkout = new CollectCheckoutService({
        email: '[email protected]',
        firstName: 'Peter',
        lastName: 'Parker',
        reference: this.generateReference(),
        amount: 1000000,
        currency: 'NGN',
        publicKey: 'XXXXXXXX',
        onSuccess(e) {
          console.log('user closed the widget.', e)
        },
        onClose(e) {
          console.log('closed the widget.', e)
        },
      })
      checkout.setup()
      checkout.open()

Collect Widget Options