Join Chris Oliver for an in-depth discussion in this video Sending a card token to the server, part of Adding Stripe Payments to Your Ruby on Rails Application.
- [Instructor] Now the last piece that we need to do is we need to open up that subscriptions new again, and we need to change this form's URL. So currently, it points to /your-charge-code which is not anything that we have in our rails application, and it's not very descriptive anyways. So we want to change this to a rails form_tag and this is going to generate a tag that also includes our CSRF token. So we want this form to actually point to the user's subscription, so we want to point it to that URL.
We want to include the CSRF token, so we have to use a rails form_tag. And we also want to submit as a POST request, and we need to include this payment-form id on it as well. So we're going to basically just convert this to a rails form_tag. So we can just say form_tag for subscription_path, we can pass in the id of payment-form and a do block, and this should convert our form to the new rails version.
So right now you see that it points to charge code. If we refresh our page we should see that if we re-inspect that, this should now have a /subscription action as well as a couple other tags. So we have a UTF8 checkmark that gets submitted as well as our CSRF authenticity token, so that rails can protect you from CSRF attacks. So this gives us a couple benefits, we get to use the rails helpers for security, and we get to post this token to our subscription path.
So now it's time to test to make sure that this form submission goes over to rails correctly, and we can receive that token. So the first thing's first is we need to make sure that this is not commented out, want to enable that. And then we want to also go into our subscriptions controller and add a create action. So this will be where we create the user's subscription, but for now we're just going to leave it empty and just see if rails can respond to that correctly. Now if we hop back to our application we can submit this form.
And while it didn't do anything visually, we can look at the rails logs and we'll see that we viewed that page, and then the next thing is that we received a POST request to subscription, which means that our form submitted correctly. And most importantly, we now have a Stripe token that we can use to charge our user server-side. So this is successfully converting the credit card number to a Stripe token and then sending that token over to us. And you'll notice that there is no credit card number that we are receiving in rails, which is a good thing.
If you ever notice that, check your form and make sure that you do not have name attributes in the HTML. So that is a sign that if you ever put a name on these inputs you will receive those server-side and that would be bad. Now one last thing that would be nice is that if this received the credit card details that we can save. So, for example, we can save your last four digits of your credit card number, your expiration month and year, and the brand of the card. And those are the fields that we created before so that we can show you the current card that you have on file.
And the stuff that we are most interested in is the credit card brand, the last four digits and the expiration year and month. So, you can grab these out and then send those over to the server the exact same way as we had penned the Stripe token. So we're going to add those lines in order to grab the brand, the expiration month and year, and the last four digits. So these are pretty straight forward, we're going to do the exact same thing and append these input tags.
And we'll say type is hidden, name equals card_brand, and we can set the value to that for response.card.brand. And you can see that by saying this object is the response.card.brand will return us Visa. So this will set that and we can grab the last ones here. So we can say last four, expiration month, expiration year, and these will simply be expiration month, expiration year, and card_last4.
And last we need to close off all these parentheses at the end. Now we've named each of these specifically to match our db schema user columns. So when we created our user table, we added some fields for the card brand, card last four and card expiration. And those four values are submitted with the exact same names so that we can save them to our user model and keep track of that really easily.
- Adding users and products to the application
- Creating a checkout form
- Creating and sending card tokens
- Subscribing the customer
- Charging the customer
- Allowing users to update payment info, cancel, and resubscribe
- Adding receipts with webhooks