CODEWITHSUNDEEP
node.jsstripe-payments
user2631182
user2631182

Reputation: 43

Stripe payment without any button

Currently I'm using a stripe payment button as a way to charge users. however, the process for this is:

they get an email, the email has a pay button. once you press the button, the button launches a page with a stripe pay button. pressing the stripe pay button opens the card payment.

I'd like to be able go straight from the user pressing the email's pay button to the card payment page opening up, instead of them having to press another button.

I've been using https://stripe.com/docs/checkout. I think that calling the stripecheckout.open directly would do the trick, however, I'm not sure how to format this call correctly with javascript.

For example, when the email pay button is pressed, the stripe pay button is generated like this

res.write('<script ');
res.write('src="https://checkout.stripe.com/v2/checkout.js" class="stripe-button"');
res.write('data-key="' + body[0].data_key + '"');
res.write('data-amount="' + body[0].data_amount +'"');
res.write('data-name="' + body[0].data_name + '"');
data_desc_string = body[0].data_description;
data_desc_short = data_desc_string.substring(7);
res.write('data-description="' + data_desc_short + '"');
res.write('data-currency="usd">');
res.write('</script>');

I'm not sure how I should rewrite it just for the stripecheckout.open.

Upvotes: 1

Views: 2422

Answers (1)

colinm
colinm

Reputation: 4288

The Custom Buttons section of the Checkout docs details how to call StripeCheckout.open().

In your case, you simply call StripeCheckout.open() once the page has loaded (because you want it to appear immediately) instead of in response to a button click (as in the example).

How exactly you'd go about that would vary with the JS framework you're using. Using jQuery as in their example code, you'd bind to $(document).ready():

  <script src="https://checkout.stripe.com/v2/checkout.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>

  <button id="customButton">Purchase</button>

  <script>
    $(document).ready(function(){
      var token = function(res){
        var $input = $('<input type=hidden name=stripeToken />').val(res.id);
        $('form').append($input).submit();
      };

      StripeCheckout.open({
        key:         'pk_test_czwzkTp2tactuLOEOqbMTRzG',
        address:     true,
        amount:      5000,
        currency:    'usd',
        name:        'Joes Pistachios',
        description: 'A bag of Pistachios',
        panelLabel:  'Checkout',
        token:       token
      });

      return false;
    });
  </script>

Upvotes: 2

Related Questions