Untitled

            
              var apiKey = 'pk_test_TYooMQauvdEDq54NiTphI7jx'
var stripe = Stripe(apiKey);

/* PAYMENT REQUEST */

var paymentRequest = stripe.paymentRequest({
  country: 'US',
  currency: 'usd',
  total: {
    label: 'Demo total',
    amount: 1000,
  },
  requestPayerName: true,
  requestPayerEmail: true,
  requestShipping: false
});

var elements = stripe.elements();
var prButton = elements.create('paymentRequestButton', {
  paymentRequest: paymentRequest,
});

// Check the availability of the Payment Request API first.
paymentRequest.canMakePayment().then(function(result) {
  if (result) {
    prButton.mount('#payment-request-button');
  } else {
    document.getElementById('payment-request-button').style.display = 'none';
    document.getElementById('checkout-button').style.display = 'block';
  }
});

paymentRequest.on('token', function(ev) {
  // Send the token to your server to charge it!
  sendTokenToBackend(ev.token.id);
});

/* CHECKOUT */

var handler = StripeCheckout.configure({
  key: apiKey,
  image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
  locale: 'auto',
  token: function(token) {
    // You can access the token ID with `token.id`.
    // Get the token ID to your server-side code for use.
    sendTokenToBackend(token);
  }
});

document.getElementById('checkout-button').addEventListener('click', function(e) {
  // Open Checkout with further options:
  handler.open({
    name: 'Stripe.com',
    description: '2 widgets',
    zipCode: true,
    amount: 2000
  });
  e.preventDefault();
});

window.addEventListener('popstate', function() {
  handler.close();
});

/* TOKEN HANDLING */

function sendTokenToBackend(token) {
  fetch('/charges', {
    method: 'POST',
    body: JSON.stringify({token: token}),
    headers: {'content-type': 'application/json'},
  })
  .then(function(response) {
    if (response.ok) {
      // Report to the browser that the payment was successful, prompting
      // it to close the browser payment interface.
      ev.complete('success');
    } else {
      // Report to the browser that the payment failed, prompting it to
      // re-show the payment interface, or show an error message and close
      // the payment interface.
      ev.complete('fail');
    }
  });
}