Friday, 12 February 2016

Accepting payments with Stripe in APEX, Part 1

I've just been investigating a payment gateway for an APEX application. I already knew about the recent startup Stripe, and their fees seemed just as good (if not better) than the other well-known contenders - I figured there would be a good place to start.

Now, I haven't actually worked with the others, but so far, I'm very impressed with the system/API available. From my little bit of research, all the card information will be stored on Stripe's servers, so we need not deal with storing and encrypting customers card information. With that, we are left with this general workflow:

  1. Include a form for customers to enter there card information
  2. The form gets submitted to Stripe's servers
  3. Returned is a token. We use this to then complete the charge

For this first part, I'll be focusing on the form. In particular, Stripe provides a form for us that we can re-use. Check out the documentation on the form here - https://stripe.com/docs/tutorials/checkout. Keep in mind, you can just as easily develop your own form if you have your own design in mind.

The basic example (for a form) they give on the docs is:

<form action="" method="POST">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="[redacted]"
    data-amount="2000"
    data-name="Demo Site"
    data-description="2 widgets"
    data-image=""
    data-locale="auto">
  </script>
</form>

Side note: In your account, you can retrieve your API tokens (and test tokens) from: https://dashboard.stripe.com/account/apikeys

So, if you add that to a static region on your page, you will see a nice checkout button and form:




What would then happen after submitting the payment information, is the form would get submitted, with some additional parameters being sent in the POST request. Being on APEX, this won't do since the whole page is wrapped around a form - resulting in this being an embedded form (unsupported).

Looking at the documentation some more, they have a more advanced example giving us more control over what happens once the Pay button is selected.

We still need to leave a reference to checkout.js on our page, so for now this can live in our region where the pay button will live. The next part will be to add a regular APEX button to our region - with the action being Defined by a Dynamic Action.

Then, we need a dynamic action for when the button is clicked - with the true action being to execute a block of JavaScript code (the handler could be set up on page load, but just chucked it in one spot for simplicity)

var handler = StripeCheckout.configure({
    key: '[redacted]',
    locale: 'auto',
    token: function(token) {
        console.log(token);
    }
});

handler.open({
    name: 'Demo Site',
    description: '2 widgets',
    currency: "aud",
    amount: 2000
});


So, now with our advanced implementation, we are left with much the same form:




(This is just test card information supplied with by Stripe - see: https://stripe.com/docs/testing)

So, when the user submits the payment information, the token function will be called. With that we are returned with the following information:


Further, if we look in our dashboard on Stripe for the account, we should see this activity logged:



So, with that information, you would then want to initiate a request to a PL/SQL process to make the actual charge to the customers card. A post for another day.

4 comments:

  1. Yes - my recommendation is to write a stored procedure to handle the post/get and bind to it from Apex. It is easier to manage. Either way you go payment sites use HTTPS so you will need to register the SSL certificate in your Oracle DB and insure your user id has ACL permissions to the url (then you can post/get all you want with the proper credentials)

    ReplyDelete
  2. I integrated a lot of payment systems in the past, starting at HTMLDB 1.6. My recommendation is the same as Jb Williams to use APEX as a front end only, do everything in a dedicated package, including all the calls, url_redirects, url_http, etc.

    ReplyDelete
    Replies
    1. Hello Learco, I just saw your reply to the post. I am really new in this world of Payments online; Do you have some blog where you have something based in your knowledge about online payment?
      This is my personal email: geova.kelly.c@gmail.com thanks in advance!

      Delete
  3. Hi learco Brizzi can you share your work i am quite new to this and i am trying the same.
    my mail : imarcofoxx@gmail.com

    ReplyDelete