v1 Integration

Note

To be PCI-compliant, you must load the SDK directly from https://pay.guesty.com (either by adding a script tag or using the ES module). You cannot include it in a bundle or host it yourself.

Manually Include a Script Tag

Add a script tag to your application head or body. This loads the guestyTokenization object to the global window scope of the browser.

<script src="https://pay.guesty.com/tokenization/v1/init.js"></script>

Use it as an ES Module

See tokenization-js for more information.

npm install @guestyorg/tokenization-js

import { loadScript } from "@guestyorg/tokenization-js";

try {
    const guestyTokenization = await loadScript();
    // Guesty Tokenization JS SDK is loaded and ready to use
} catch (error) {
    console.error("Failed to load the Guesty Tokenization JS SDK script", error);
}

Add a container element to your page within which the iframe will be rendered:

<div id="guesty-tokenization-container"></div>

Call the guestyTokenization.render(options) function to render the iframe in the container element. See Reference for all customization options.

try {
    // start loading iframe
    await guestyTokenization.render({
        containerId: "guesty-tokenization-container",
        providerId: "YOUR_PAYMENT_PROVIDER_ID"
    });
    // iframe loading finished
} catch (e) {
    console.error("Failed to render the Guesty Tokenization form", e);  
}

Call the guestyTokenization.submit() function to submit the form:

try {
    const paymentMethod = guestyTokenization.submit();
    // Process payment method via Guesty's API
} catch (e) {
    console.error("Failed to submit the Guesty Tokenization form", e);
}