EasyflowEasyflowDocs

SDKs

Official JavaScript libraries to encrypt card data and track events on your checkout.

On this page

Easyflow provides JavaScript libraries for the parts of the integration that run in the browser.

SDK Package Use it to
Web SDK @easyflow/javascript-sdk Encrypt credit card data before creating a charge.
Pixel SDK @easyflow/pixel Send checkout events to your marketing pixels.

Web SDK

The Web SDK encrypts the card data in the browser, so your server only handles an encrypted token. The complete reference is in the SDK documentation.

Load it on your checkout page from the CDN:

<script src="https://easyflow-sdk.pages.dev/easyflow-sdk.min.js"></script>

The SDK is also published on npm as @easyflow/javascript-sdk. Check the package page to use it with a bundler.

Configure the SDK with your business identifier and encrypt the card. Replace your-business-id with the identifier of your business, which contains only letters, numbers and hyphens:

window.easyflowSDK.configure({
  businessId: 'your-business-id',
});

const encryptedCard = await window.easyflowSDK.encrypt({
  cardNumber: '5480832801033311',
  holderName: 'JOHN DOE',
  month: '12',
  year: '2035',
  cvv: '123',
});

Send the encrypted token in payments[].creditCard.token when you create the charge. The Accepting payments guide shows the complete flow.

Pixel SDK

Tracking pixels send the events of your checkout to marketing platforms. The supported platforms are google, meta, gtm and tiktok.

  1. Create the pixel with Create pixel, choosing the platform and the events to track.
  2. Integrate the pixel into your website or application with the Pixel SDK:
npm install @easyflow/pixel

The usage instructions are on the package page.

Some of the events that a pixel can track:

Event When it happens
checkout-initialized The checkout is opened.
purchase-completed The purchase is completed.
purchase-failed The purchase fails.
pix-generated A PIX code is generated.
pix-copied The PIX code is copied.
credit-card-selected The buyer chooses to pay with a credit card.
bank-slip-selected The buyer chooses to pay with a bank billet.
coupon-added A coupon is applied.

The Create pixel page lists every available event.