How to implement stripe payment in Appmaker?

Question

I am learning the Corporate store tutorials on Appmaker. I am trying to customize the template by integrating a stripe payment method to it. I used stripe's checkout code template. I put this on a function and attached a onclick trigger to run this. I am running into a problem when I try to complete the charge process as shown here in step 2 of the official Stripe-Go checkout guide. Can someone explain the code template to complete the payment charge

Answer 1

Here you go:

Client scripts

var AMOUNT = 51;

// Callback to handle token ready event
function onTokenReady(token) {
  // Call server script
  google.script.run
    .withFailureHandler(function() {
       // TODO: handle error
     })
    .withSuccessHanlder(function() {
       // TODO: handle success
     })
    .charge(token.id, AMOUNT);
}


// Initializes Stripe client-side API
// To make it work add https://checkout.stripe.com/checkout.js
// as external JavaScript resource (see screenshot above)
function onAppStart() {
  window.handler = StripeCheckout.configure({
    key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
    image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
    locale: 'auto',
    token: onTokenReady
  });
}


// Handles payment button's click event
function onButtonClick() {
  handler.open({
    name: 'Stripe.com',
    description: '2 widgets',
    zipCode: true,
    amount: AMOUNT
  });
}

Server scripts

function charge(tokenId, amount) {
  var params = {
    payload: {
      amount: amount,
      currency: 'usd',
      description: 'Example charge',
      source: tokenId
    },
    headers: {
      // TODO: replace with real PLATFORM_SECRET_KEY
      Authorization: 'Bearer sk_test_BQokikJOvBiI2HlWgH4olfQ2'
    }
    // uncomment to troubleshoot
    // ,muteHttpExceptions: false
  };

  var response = UrlFetchApp.fetch('https://api.stripe.com/v1/charges', params);

  console.log(response.getContentText());
}