Skip to main content
If the Virtual Card SDK is not a viable option, the manual integration will guide you through the steps to complete a virtual card session in your checkout.

​
Overview

  1. Create a virtual card session
  2. Add a window event listener with type message to the checkout page
  3. Open the card session dashboard_url using the mode provided in the create card session request
  4. Sezzle will post a message to the listener when the user has completed the card session
  5. Verify message event.data exists
  6. Verify event.data.szl_source = v_card
  7. Verify event.data.card and event.data.holder both exist
    • If they exist
      • Use card and holder data to submit the order by credit card
    • If they don’t exist
      • The user did not provide virtual card data

​
Example Javascript

window.addEventListener("message", function () {
    var data = event.data || Object.create(null);

    if (data.szl_source !== "v_card") {
        console.log("invalid source");
        return;
    }

    var card = data.card;
    var holder = data.holder;
    if (!card && !holder) {
        console.log("failed virtual card session");
        return;
    }

    console.log(
        "card data:",
        card.firstName,
        card.lastName,
        card.pan,
        card.cvv,
        card.expiryMonth,
        card.expiryYear
    );

    console.log(
        "holder data:",
        holder.email,
        holder.phone,
        holder.firstName,
        holder.lastName,
        holder.address1,
        holder.address2,
        holder.city,
        holder.state,
        holder.country,
        holder.postalCode
    );
});