Skip to main content
The Henry JS SDK gives your frontend a complete checkout experience out of the box. Drop a fully managed checkout widget into any page in seconds, or embed a secure card input for custom payment flows - all from a lightweight, framework-agnostic library.

Checkout Widget

Embed a complete buy-now checkout button and modal that handles cart, payment, and order confirmation

Card Element

Securely collect card details in an isolated iframe and tokenize them for server-side processing

Get started in minutes

1

Install the SDK

npm install @henrylabs/js
Or load it directly from the CDN - no build step required:
<script src="https://cdn.jsdelivr.net/npm/@henrylabs/js"></script>
When loaded via CDN, the SDK is available as window.Henry.
2

Get your Widget ID

Go to the Henry Dashboard and copy your Widget ID. You’ll pass this to createCheckoutElement.
3

Add a container and mount the widget

<div id="checkout-container"></div>

<script type="module">
  import Henry from "@henrylabs/js";

  Henry.createCheckoutElement("#checkout-container", {
    widgetId: "widget_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
    items: [
      {
        link: "https://www.nike.com/t/some-product/ABC-123",
        quantity: 1,
      },
    ],
  });
</script>

How it works

The Henry JS SDK renders UI elements inside your page using lightweight iframes. This keeps sensitive data (card numbers, payment info) fully isolated from your application while letting you control placement, styling, and events.
  • Card Element - renders a secure card input iframe. Call submit() to tokenize the card and receive a cardToken you can pass to your server.
  • Checkout Widget - renders a button (full, compact, comfortable, or bubble) that opens Henry’s hosted checkout modal on click. You supply the product links; Henry handles cart creation, payment, and order tracking.
The Checkout Widget requires a Widget ID from the Henry Dashboard.

Explore the guides

Quickstart

End-to-end walkthrough - install, mount, and handle checkout events

Checkout Widget

All options, display modes, and events for the checkout widget

Card Element

Embed secure card collection and tokenize for server-side payment