#288 Billing with Stripe

Ahhhhhhhhhhhhhhh only US :(

Can't use it here, oh well :(

Just what I was about to use! Always on the ball.

Very nice recommendation! I hadn't seen stripe before and have been grudgingly testing other payment processors. This looks fantastic and very reasonable

I cannot believe how easy Stripe has made ecomm for developers! Thanks for the intro to this killer offering.

Great video on a great service. For those outside the US, know that Stripe is working on it. :)

Stripe on HackerNews

Thanks!

A couple of questions:

1. Why do you pass the API key into the meta tag and grab it in the javascript instead of just hard coding it into the javascript?

2. In the "save_with_payment" instance method, why do you reference "self" when assigning the customer id to an attribute of the instance.

3. In the new action of the subscriptions controller, why do you need "@subscription = plan.subscriptions.build"?

meltzerj,

Regarding question 2...

You can see that Ryan adds a stripe_customer_token to the subscription model:

rails g migration add_stripe_to_subscriptions stripe_customer_token:string

self.stripe_customer_token = customer.id sets that in the current subscription object (taken from the object returned by Stripe::Customer.create() method).

Hope that helps!

Regarding question 3...

It has to do with the model associations.

When you say:

@subscription = plan.subscriptions.build

you are really saying something like:
@subscription = Subscription.new(plan_id: id)

You are wanting an object that already has the association (to a particular Plan, in this case) set. This object is passed to the form with the association set -- so it knows how this particular Subscription object relates to a specific Plan object.

see: http://api.rubyonrails.org/classes/ActiveRecord/Associations/ClassMethods.html

Which is better to use? Braintree or stripe?

Am I correct in thinking that I could bypass the credit card payment altogether by manually setting a value to the hidden token field (using javascript console or similar before submitting)?

Thanks.

A couple of questions about your implementation of save_with_subscription:

1) you use save! in your implementation. Would it be better to either return the result of save, or change the name of the function to save_with_subscription!, in order to better follow conventions?

2) I noticed that you don't handle failures to save. In the real world, we would need to handle that failure by manually rolling back the subscription creation. Or is there a better way to handle this with Stripe?

Since jQuery 1.6 you should use prop() method to set boolean attributes: $('input[type=submit]').prop('disabled', true)

really like the coffee script stuff in this, I learned a lot

I use Braintree, which I love. But it has two problems, first I pay a monthly fee, second I have to pay another monthly fee for each application I write (since the name on the account has to be "prominently displayed on your site", it has to be the application name not a company name, and hence not sharable across applications).

With this, I get the pricing of PayPal but the customer convenience of entering credit cards directly on my site. Way cool. Can hardly wait to set it up.

For those who aren't using CoffeeScript, here is the compiled subscriptions.js file: https://gist.github.com/1307748

Great episode, btw. I'm loving Stripe so far.

Can anyone expand here on why using a before create callback is a bad idea? In looking at the Stripe monospace-rails example app, it handles a user updating their card quite nicely, which wasn't covered in this episode. However, a before_save call is how they're handling it.

Awesome episode, I'm so grateful for this intro into Stripe

Thanks,

if $('#card_number').length

was always returning 1 for me, even if there were no values in the input.

So I used

if $('#card_number').val().length > 0

and that worked.

Hi there, Ryan says in the video that we should gitignore the stripe api key initializer file so to avoid it being divulge in general development. But when the time comes that we do need to push it to the production server, like Heroku which I use, how do you go about it? do you do something with git add just for that one push?

Great episode Ryan!

It would be AWESOME if you could go into more depth in stripe, even if it is with the pro subscription. It would be very very useful.

Thanks!

Useless to anyone outside of the US :(

I was very excited about this, but when I contacted Stripe, they said they will let me know when they will be available in Europe (England in my case) but I'm not holding my breath.

Ryan, for this one, I really wish you had included some info on how to test.

Have you considered doing an episode on the rest of Stripe Integration? Things like:
upgrades, downgrades, cancellations, receiving webhooks, updating cc info, handling failed payments, etc.? I've built several subscription sites with authorize.net and these things are always such a pain. I would love find out if there are any best practices and see how other Rails developers handle such things.

Any reason this would not working in production mode? I know the code gets minified. I altered the code for new user but works great in development. I set break points in the deminified javascript and it is as it does not even get called. The new_user id is there in the HTML. This might be too heavy to post here but I feel it is something stupid that I missing. Thanks for any help. Here is a portion of the deminified javascript:

...

if (c.data("typeahead")) return;
b.preventDefault(), c.typeahead(c.data())
})
})
}(window.jQuery), function() {}.call(this), function() {
var a;
jQuery(function() {
return Stripe.setPublishableKey($('meta[name="stripe-key"]').attr("content")), a.setupForm()
}), a = {
setupForm: function() {
return $("#new_user").submit(function() {
return $("input[type=submit]").prop("disabled", !0), $("#card_number").length ? (a.processCard(), !1) : !0
})
},
processCard: function() {
var b;
return b = {
number: $("#card_number").val(),
cvc: $("#card_code").val(),
expMonth: $("#card_month").val(),
expYear: $("#card_year").val()
}, Stripe.createToken(b, a.handleStripeResponse)
},
handleStripeResponse: function(a, b) {
return a === 200 ? ($("#user_stripe_card_token").val(b.id), $("#new_user")[0].submit()) : ($("#stripe_error").text(b.error.message), $("input[type=submit]").prop("disabled", !1))
}
}
}.call(this);

Hey guys,
When I remotely load the new form and click on submit button; the javascript is simply ignored and the form is submitted to the controller. This leads to "Invalid token" error as no token was generated. But if I don't load the form via remotely, everything works fine. Any idea what am I doing wrong?

This is how I render the new form:

$('#show-content').html("<%= escape_javascript(render :partial => 'create_form') %>");

I noticed this is all done without SSL on the web app. Yes, the JSON calls to Stripe are done via SSL, but that's not obvious to the casual user. Would you recommend that the payment form be served via SSL, even if just to give the user some reassurance?

Stripe is now in Beta for Canada :)

Hi guys, does anyone have a good resource on creating multiple user plans and subscriptions? I've followed Michael Hartl's tutorial, and am on to my own app, but I don't know where to begin with multiple user roles.

Most of the application is already written. There are four different plans and users can sign up for any one of them to create a subscription. There’s only an email field on the sign-up page right now and when we fill that field in and submit the form a new subscription will be created.

In subscriptions.js.coffee:

subscription =
  setupForm: ->
      $('#new_subscription').submit ->
      $('input[type=submit]').attr('disabled', true)
      subscription.processCard()
      false

You need to add 'false' to prevent the submit button from working and going to the next page.

For details that are not covered in the RailsCast, take a look at the open source example application for a Rails Membership/Subscription/SaaS Site from the RailsApps project. It comes with a tutorial that goes into detail about how to integrate Stripe with Devise, shows how to use Stripe webhooks, and explains the implementation in detail.

Question: In the controller, I can't do

@subscription = Subscription.new(params[:subscription])

because plan_id is not accessible. How did you get around this?

This is an outstanding episode! So concise and helpful.

Just one question... One small JQuery-related thing through me for a loop.

in /app/assets/javascripts/subscriptions.js.coffee, why was the change made to:

$('#new_subscription')[0].submit()

?

What is the [0] for? I have not seen that before.

For information, the app crashes when handling failure scenario provided by stripe. https://stripe.com/docs/testing

If you are receiving an error message similar to

An unexpected error has occurred. We have been notified of the problem.

then this could be due to the fact that you have updated your API. I have a support ticket into Stripe to see what can be done about this. However, currently, I've just bypassed this error using the below coffeescript.

      if response.error.message == "An unexpected error has occurred. We have been notified of the problem."
        $('input[type=submit]').attr('disabled', false)
      else
        $('#stripe_error').text(response.error.message)
        $('input[type=submit]').attr('disabled', false)

Did anyone track down this problem? I'm still trying to find a solution.

I am also getting the "An unexpected error has occurred. We have been notified of the problem.". Has anyone found a solution???

I'd suggest you guys just check out the new Stripe docs. They're very clear and have been updated over the past year and a half.

Just an FYI...I finally gave up on solving this problem, and worked through the docs and examples on the stripe site. It's now working fine after I ditched jQuery and used plain old js. I know seems crazy.

Stripe is awesome but they don't accept eChecks, yet. Is there another option that will allow ACH payment processing?

Stripe in Beta in UK.

I had the same error - "An unexpected error has occurred. We have been notified of the problem."

I got it working following the Stripe tutorial (https://stripe.com/docs/tutorials/forms) which uses https://js.stripe.com/v2/ and has some differences, including the 'data-stripe' attribute.

Tried to add drop-downs for the expiry date and was told by Stripe support "The data-stripe version of Stripe.js doesn't support dropdowns yet (we're working to fix this). In the meantime, feel free to copy the old method from https://gist.github.com/boucher/1750368)"

Does anyone have any examples of using stripe in a nested form. For example I have a nested form that contains an affiliate which has_one subscription. This same affiliate also has a captcha. The problem is that that if i do something like

if @affiliate.subscription.save_with_payment && @affiliate.save_with_captcha

and there are errors with my affiliate model but not my subscription model, then the subscription gets saved without an affiliate_id, a customer is created by stripe and the same form re-renders populated with the stripe_token and the newly created subscription_id. Once the form is resubmitted and Affiliate.new(params[:affiliate] ) is called in the create action it is raising an error like Couldn't find Subscription with ID=31 for Affiliate with ID= since there is no affiliate_id in the subscription row in the DB. It would really be nice to see an example of this inside a nested form. Help!

Great lesson, Ryan. I share this because it slipped by me and it took a lot of troubleshooting to catch it. Hope it helps someone else. When you coded setupForm with $('#new_subscription').submit -> you said, "(#new_subscription), that is the default name that Rails will give it...". The Rails default name for my form wasn't working and I actually had to ID tag the whole form.

Ive been getting the following error "You must supply a valid card" i cant seem to find any info on the stripe docs, have any of you been getting this lately?

Has anyone figured out how to implement this for one-time payments as opposed to recurring/subscription?

Hi guys,

great tutorial. I setup the subscription part and before integrating the stripe part, I want to add an association to the user. I have a user model with devise and want people to create a user account before being able to make a subscription. The problem is, that I am confused on how to get the user_id into the subscription. Can someone help?

sorry to bother you guys again. I got to the very end with everything working, but now receiving Stripe::InvalidRequestError in SubscriptionsController#create

my error highlighted this.

customer = Stripe::Customer.create(description: email, plan: plan_id, card: stripe_card_token)

This is an awesome tutorial!

Firefox does not seem to clear the credit card number fields before submitting (even though name: nil on each one) as I discovered CC #'s in my logfiles!

So I modified my orders.js.coffee as follows:

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#order_stripe_card_token').val(response.id)
      # clear CC fields before submitting to Rails:
      $('#card_number,#card_code,#card_month,#card_year').val('')
      $('#new_order')[0].submit()

typo in asciicast:

#{e.mesage} -> #{e.message}

Hi Guys. Followed the tutorial above and getting an error with the stripe_token not being passed. Am getting the following error

Parameters: {"utf8"=>"V", "authenticity_token"=>"JLYuag3ojhYttMw3YOLBD5+J7NUly
zM61YFgRhKkc3M=", "subscription"=>{"stripe_card_token"=>"", "plan_id"=>"8", "ema
il"=>"test@mail.com"}, "commit"=>"Subscribe"}
←[1m←[35mPlan Load (0.0ms)←[0m SELECT "plans".* FROM "plans" WHERE "plans"."i
d" = ? ORDER BY "plans"."id" ASC LIMIT 1 [["id", 8]]
Stripe error while creating customer: You passed an empty string for 'card'. We
assume empty values are an attempt to unset a parameter; however 'card' cannot b
e unset. You should remove 'card' from your request or supply a non-empty value

 class Subscription < ActiveRecord::Base
        belongs_to :plan
        validates_presence_of :plan_id
  validates_presence_of :email

  attr_accessor :stripe_card_token

  def save_with_payment
    if valid?
      customer = Stripe::Customer.create(description: email, plan: self.plan.name, card: stripe_card_token)
      self.stripe_customer_token = customer.id
      save!
    end
  rescue Stripe::InvalidRequestError => e
    logger.error "Stripe error while creating customer: #{e.message}"
    errors.add :base, "There was a problem with your credit card."
    false
  end

end

```jQuery ->
Stripe.setPublishableKey($('meta[name="stripe-key"]').attr('content'))
subscription.setupForm()

subscription =
setupForm: ->
$('#new_subscription').submit ->
$('input[type=submit]').attr('disabled', true)
subscription.processCard()
false

processCard: ->
card =
{number: $('#card_number').val(),
cvc: $('#card_code').val(),
expMonth: $('#card_month').val(),
expYear: $('#card_year').val()}

Stripe.createToken(card, subscription.handleStripeResponse)

handleStripeResponse: (status, response) ->
if status == 200
$('#subscription_stripe_card_token').val(response.id)
$('#new_subscription')[0].submit()
else
$('#stripe_error').text(response.error.message)
$('input[type=submit]').attr('disabled', false)```

Any help would be greatly appreciated

I have this empty card error as well
Stripe error while creating customer: You passed an empty string for 'card'. We
assume empty values are an attempt to unset a parameter; however 'card' cannot b
e unset. You should remove 'card' from your request or supply a non-empty value

It's fixed just update the stripe version to v2 from v1 in the layout files or wherever you have included it.

entering dummy card number 4111111111111111 and cvv 123 solved the following issue for me:

Stripe error while creating customer: You passed an empty string for 'card'. We
assume empty values are an attempt to unset a parameter; however 'card' cannot b
e unset. You should remove 'card' from your request or supply a non-empty value

if you are getting empty values:

Stripe error while creating customer: You passed an empty string for 'card'. We
assume empty values are an attempt to unset a parameter; however 'card' cannot b
e unset. You should remove 'card' from your request or supply a non-empty value

1. Turn Off Turbolinks - wrap your links to the subscription form with no-data-turbolink. Turbrolinks is not re-loading the subscription.js.coffee on page load, so the code dosen't load the card values.

<div data-no-turbolink> <%= link_to 'New Subscription', new_subscription_path %></div>

1. update to stripe v2

<%= javascript_include_tag "https://js.stripe.com/v2/", 'application', 'data-turbolinks-track' => true %>

Drove me crazy!

Stripe now available in the UK. And yes, this is by far the simplest payment system out there. Excellent cast as ever

For anyone who's finding that the coffeescript for this app isn't working, it's probably worth looking at this http://stackoverflow.com/questions/20081255/cannot-get-stripe-js-working-with-my-rails-4-app

Hi,

Just curious to know the difference between:

Stripe.createToken method used in this tutorial and Stripe.card.createToken as presented in the Stripe document.

Thanks

Hi ,

i need to know that can we implement below payment process using strip payment gateway

User1's Credit card--->fund transfer--to admin strip account-->20% commission deducted for admin--->80% of fund transfer to user2's paypal or bank account.

We are trying to implement this in out site what having the issues in implementation.

Can anybody help in this..

Thanks

Hi there,

Trying to get a spinner on the submit button rather than just disabling it. Usually I just do it with:

<%= button_tag "Submit", class: 'mb-xs mt-xs mr-xs btn btn-primary btn-block', data: {disable_with: " Wait..."} %>

But this doesnt seem to work. Any ideas?

Thanks

You can process Stripe payments in the background, checkout Processing Stripe Payments with a Background Worker in Rails 5