0

So I'm currently in the final stages of designing a small online shop and I'm having a bit of difficulty understanding what the stripe token contains, how to pick it up on the node.js server and that kind of thing.

currently, my client-side code looks like this:

        <div style="text-align: center;">

        <form id="paymentForm" action="//httpbin.org/post" method="POST">
          <input type="hidden" id="stripeToken" name="stripeToken" />
          <input type="hidden" id="stripeEmail" name="stripeEmail" />
            <input type="hidden" id="cartTotal" name="cartTotal" />
          <input type="hidden" id="cartContents" name="cartContents" />
        </form>

        <p><input type="button" class="button" id="purchaseButton" value="チェックアウト"></p>


        <script>

            var totalCost = 0;
            var totalCartLoad = "";
            totalCost = localStorage.getItem('totalCartPrice');
            totalCartLoad = localStorage.getItem('whatsInCart');
            totalCartLoad = totalCartLoad.replace('undefined','');
            totalCartLoad = '_____________________________________' + totalCartLoad;
            var finalCartLoad = String(totalCartLoad); //convert it to a string for display



            var handler = StripeCheckout.configure({
              key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
              token: function(token) {
                $("#stripeToken").val(token.id);
                $("#stripeEmail").val(token.email);
                $("#cartTotal").val(totalCost);
                    $("#cartContents").val(finalCartLoad);
                $("#paymentForm").submit();
              }
            });

            $('#purchaseButton').on('click', function(e) {


              // Open Checkout with further options
              handler.open({
                    name: "チェックアウト",
                    description: finalCartLoad,
                    shippingAddress: true,
                    billingAddress: true,
                    zipCode: true,
                    allowRememberMe: true,
                    currency: 'JPY',
                    amount: totalCost
              });
              e.preventDefault();
            });

            // Close Checkout on page navigation
            $(window).on('popstate', function() {
              handler.close();
            });

        </script>

    </div>

and my server code looks like this:

const stripe = require("stripe")("sk_test_BQokikJOvBiI2HlWgH4olfQ2");

module.exports = (req) => {
  // the token is generated by Stripe and POST'ed
  // to the `action` URL in our form
  const token = req.body.stripeToken;

  // now we create a charge which returns a `promise`
  // so we need to make sure we correctly handle
  // success and failure, but that's outside of this
  // function (and we'll see it later)
  return stripe.charges.create({
    // ensures we send a number, and not a string
    amount: parseInt(process.env.STRIPE_COST, 10),
    currency: process.env.STRIPE_CCY,
    source: token,
    description: process.env.STRIPE_DESCRIPTION, //  remember to change this!
    // this metadata object property can hold any
    // extra private meta data (like IP address)
    metadata: {},
  });
}

However I am uncertain how to make sure that the details I need such as shipping address, customer email, product manifest and that kind of thing, which I have collected on my client, end up where I need it, on the invoice or somewhere in my account on stripe. I am also uncertain exactly how the charge is made (I know I need an app.js file to go with this as well, so I'd appreciate some pointers at this point cause its really been doing my head in.

Jobalisk
  • 728
  • 1
  • 6
  • 17

2 Answers2

2

The Token.id is what you want to use as the source when creating the Charge, and it looks like that's what you're doing, so you should be good to go from that side.

You should currently find the email at req.body.stripeEmail; in fact, you should find all of the following in req.body:

$("#stripeToken").val(token.id);        // req.body.stripeToken
$("#stripeEmail").val(token.email);     // req.body.stripeEmail
$("#cartTotal").val(totalCost);         // req.body.cartTotal
$("#cartContents").val(finalCartLoad);  // req.body.cartContents

In order to get the Shipping address, you'll need to pass those along too; you can find them in the args argument of the token() function, so you just need to pull what you need from there and send it along in your form as well.

floatingLomas
  • 8,553
  • 2
  • 21
  • 27
  • Sorry, just checking, would this be correct implimentation on server side? description: process.env.STRIPE_DESCRIPTION, shippingAddress: process.env.STRIPE_SHIPPINGADDRESS, billingAddress: process.env.STRIPE_BILLINGADDRESS, – Jobalisk Jun 29 '18 at 02:08
  • No, you want to send them along in form elements and get them from req.body. – floatingLomas Jun 30 '18 at 16:10
  • Thanks for the clarification. I've added an answer with what I have now. – Jobalisk Jul 01 '18 at 06:31
0
            var handler = StripeCheckout.configure({
              key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
              token: function(token) {
                $("#stripeToken").val(token.id);
                $("#stripeEmail").val(token.email);
                $("#cartTotal").val(totalCost);
                    $("#cartContents").val(finalCartLoad);
                    $("#userShippingA").val(token.shippingAddress);
                    $("#userBillingA").val(token.billingAddress);   
                $("#paymentForm").submit();
              }
            });


  return stripe.charges.create({
// ensures we send a number, and not a string
amount: parseInt(process.env.STRIPE_COST, 10),
currency: process.env.STRIPE_CCY,
source: token,
description: req.body.cartContents,
shippingAddress: req.body.shippingAddress,
billingAddress: req.body.billingAddress,
email: req.body.stripeEmail,
Jobalisk
  • 728
  • 1
  • 6
  • 17
  • That's is going to get your cost from an environment variable, and it will be the same for everyone (assuming you've set the environment variable). The addresses are in the second argument to the token function, as described in the docs I linked in my answer. What you've got here won't work. – floatingLomas Jul 02 '18 at 14:18
  • Ok. I've altered the checkout token creation to this: token: function(token, args) { and I'm trying to read the args with description: args.cartContents, and the like. – Jobalisk Jul 04 '18 at 02:24
  • `args` only contains the things listed here: https://stripe.com/docs/checkout#required The rest - your stuff - you'll have to pass along yourself from your form. – floatingLomas Jul 05 '18 at 04:52
  • Thank you. In the ended up implimenting a paypal account not needed pay by card form. It works bettter. – Jobalisk Dec 06 '18 at 23:34