// Fetch your Stripe publishable key to initialize Stripe.js // In practice, you might just hard code the publishable API // key here. fetch('/config') .then(function (result) { return result.json(); }) .then(function (json) { window.config = json; window.stripe = Stripe(config.publicKey); }); // When the form is submitted... var submitBtn = document.querySelector('#submit'); submitBtn.addEventListener('click', function (evt) { var inputEl = document.getElementById('quantity'); var quantity = parseInt(inputEl.value); inputEl = document.getElementById('currency'); var currency = inputEl.value; inputEl = document.getElementById('frequency'); var frequency = inputEl.value; // Create the checkout session. fetch('/create-checkout-session', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ user_csrf: window.config.csrf, quantity: quantity, currency: currency, frequency: frequency }), }).then(function (result) { return result.json(); }).then(function (data) { // Redirect to Checkout. with the ID of the // CheckoutSession created on the server. stripe.redirectToCheckout({ sessionId: data.sessionId, }) .then(function(result) { // If redirection fails, display an error to the customer. if (result.error) { var displayError = document.getElementById('error-message'); displayError.textContent = result.error.message; } }); }); });