Using Stripe.com payment with Cold Fusion Forms

[jamie61880]

Hi. Does anyone know how to integrate a Cold Fusion form with the payment site stripe.com? I've tried taking their examples to see if I could just get money from the form into my test account on Stripe, but it doesn't work. I've updated the PublishableKey with the test key I have in my account. I'm not sure if I need to download something else to our site first in order for it to work. Has anyone used this site before to do payments with their cold fusion forms?

Andy

[WolfShade]

Hi, jamie61880‌,

I've never heard of stripe.com, so I can't really speak to that.  However, one thing that I think cannot be stressed enough is to not use CFFORM, or any of the related CF{form element}.  The form validation is not that great, not very granular, doesn't work well with any JavaScript you use.  When it was first introduced, it was pretty nice, especially if you were making Flash forms.  But I don't know any veteran developers who use it.  I wish Adobe would just deprecate it.

Using examples is a great way to get started on something like this; unfortunately, it doesn't really give you a sense of what is going on, how to actually implement it, nor the _why_ of it.  If there is documentation explaining all of it, I'd highly recommend (no matter how pressed for time you may or may not be) you delve into the documentation to gain a reasonably full understanding of the process; as opposed to a very rudimentary grasp.

Anyway, I hope that someone else who is versed with stripe.com comes across your post and can help you with your issue.

V/r,

^_^

[James Moberg]

Have you considered using an existing library?  We've been using CFPayment and it works well with Stripe.

https://github.com/ghidinelli/cfpayment

Here's how to charge a credit card with Stripe using 6 lines of code (from the project page):

// initialize gateway

cfg = { path = "stripe.stripe", TestSecretKey = "tGN0bIwXnHdwOa85VABjPdSn8nWY7G7I" };

svc = createObject("component", "cfpayment.api.core").init(cfg);

gw = svc.getGateway();

// create the account

account = svc.createCreditCard().setAccount(4242424242424242).setMonth(10).setYear(year(now())+1)

  .setFirstName("John").setLastName("Doe");

// in cents = $50.00, defaults to USD but can take any ISO currency code

money = svc.createMoney(5000);

// charge the card

response = gw.purchase(money = money, account = account);

// did we succeed?

if (response.getSuccess()) {

  // yay! look at response.getResult() or response.getParsedResult()

  // verify response.isValidAVS() or response.isValidCVV()

} else {

  // check response.getStatus(), output response.getMessage()

}

[jamie61880]

Jamo,

   I think this is where I'm getting confused. Even the code you have above, does that go inside Java Script tags like this:

<SCRIPT LANGUAGE="JavaScript">

</script>

If so, where do you put this? In it's own page under the root level of the site if that's where the form is located? Do I have to call the file a specific name? So there would just be this page and the form page, correct? Or do I have to download a zip file that has all the library files, data, etc. in it? I can't remember where this is located. I found the form on stripe.com that is an example and I think I can get the token created, but I'm not sure where to put the code for charging the card at. It doesn't explain that very well. It's the code for either Ruby, Java, etc. Here's what I have on my test_stripe.html page so far:

<script type="text/javascript" src="https://js.stripe.com/v2/"></script>

  <!-- jQuery is used only for this example; it isn't required to use Stripe -->

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

  <script type="text/javascript">

    // This identifies your website in the createToken call below

    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    var stripeResponseHandler = function(status, response) {

      var $form = $('#payment-form');

      if (response.error) {

        // Show the errors on the form

        $form.find('.payment-errors').text(response.error.message);

        $form.find('button').prop('disabled', false);

      } else {

        // token contains id, last4, and card type

        var token = response.id;

        // Insert the token into the form so it gets submitted to the server

        $form.append($('<input type="hidden" name="stripeToken" />').val(token));

        // and re-submit

        $form.get(0).submit();

      }

    };

    jQuery(function($) {

      $('#payment-form').submit(function(e) {

        var $form = $(this);

        // Disable the submit button to prevent repeated clicks

        $form.find('button').prop('disabled', true);

        Stripe.card.createToken($form, stripeResponseHandler);

        // Prevent the form from submitting with the default action

        return false;

      });

    });

  </script>

</head>

<body>

  <h1>Charge $10 with Stripe</h1>

  <form action="" method="POST" id="payment-form">

    <span class="payment-errors"></span>

    <div class="form-row">

      <label>

        <span>Card Number</span>

        <input type="text" size="20" data-stripe="number"/>

      </label>

    </div>

    <div class="form-row">

      <label>

        <span>CVC</span>

        <input type="text" size="4" data-stripe="cvc"/>

      </label>

    </div>

    <div class="form-row">

      <label>

        <span>Expiration (MM/YYYY)</span>

        <input type="text" size="2" data-stripe="exp-month"/>

      </label>

      <span> / </span>

      <input type="text" size="4" data-stripe="exp-year"/>

    </div>

    <button type="submit">Submit Payment</button>

  </form>

Where do I put this java script code at to charge the card?

// Set your secret key: remember to change this to your live secret key in production // See your keys here https://dashboard.stripe.com/account/apikeys Stripe.apiKey = "sk_test_aXVaomllq5y04qU7rM8YQHvv";  // Get the credit card details submitted by the form String token = request.getParameter("stripeToken");  // Create the charge on Stripe's servers - this will charge the user's card try { Map<String, Object> chargeParams = new HashMap<String, Object>(); chargeParams.put("amount", 1000); // amount in cents, again chargeParams.put("currency", "usd"); chargeParams.put("source", token); chargeParams.put("description", "Example charge"); Charge charge = Charge.create(chargeParams); } catch (CardException e) { // The card has been declined }

Once I know where to put this, is this all I need and it will charge my test credit card and show up in my account, correct? Is there anything else I'm missing?

Andy

[James Moberg]

If you're using javascript and not ColdFusion, your question is not ColdFusion-related then.  I would repost your question in a Strip forum or StackOverflow.

[nic_tunney]

We've used the Stripe CFC located here: GitHub - jeisenlo/ColdFusion-Stripe-CFC: ColdFusion Wrapper for Stripe.com

Very easy to configure and it uses the Stripe RESTful API using cfhttp.  Just be sure to start with a developer account on Stripe and enter the development credentials while getting everything set up.