examples/sdk/with-html/redeem.html

<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Voucherify Redeem</title>
    </head>

    <body>
        <form id="redeemForm">
            <fieldset>
                <legend>Redeem Voucher</legend>
                <p><label>Voucher Code (eg. test_voucher_1)</label>
                    <input type="text" name="code" id="voucherCode">
                </p>
                <p><input type="submit" name="submit" value="Save"></p>
        </form>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.5.1/qs.min.js" crossorigin></script>
        <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
        <script type="text/javascript"
            src="https://unpkg.com/@voucherify/sdk@1.0.0/dist/voucherifysdk.umd.production.min.js" crossorigin></script>

        <script>
            const voucherify = VoucherifySDK.VoucherifyClientSide({
                clientApplicationId: "158106cb-c95a-42e8-bc73-01ba34e2e756",
                clientSecretKey: "c84aaea9-9f4a-47b3-a49f-4a5c4bd37964",
                origin: "example.com"
            });

            voucherify.setIdentity("gustav@purpleson.com");

            const redeemVoucher = (e) => {
                e.preventDefault();
                const voucherCode = document.getElementById("voucherCode").value;

                voucherify
                voucherify
                    .redeem(voucherCode, {
                        order: {
                            amount: 1000,
                            items: [{ product_id: 'prod_Bi7sRr3kwvxH2I', sku_id: null, quantity: 1 }],
                        },
                    })
                    .then((result) => {
                        console.log(result);
                    })
                    .catch(console.error);
            };

            document
                .getElementById("redeemForm")
                .addEventListener("submit", redeemVoucher, false);

        </script>
    </body>

</html>