Stripe Checkout overview 0:00You want to sell a product, or an app, or a book, or maybe you want to sell subscriptions to your site, like I offer at Laracast. Well, you've got to accept payments, and it's a really scary thing, but I'm going to show you each step of the process. So we're going to use Stripe, that's what I generally recommend. You can sign up for free. Okay, so I'm going to sign in to this little account I made. And by the way, if you're working along, pause the video and sign up. It'll only take a minute. Anyways, you'll see two different settings here, Live and Test. Test, naturally, is for local development, and Live is for production, where you're accepting real money. In this case, we've accepted nothing. So let's take a look at the documentation. And step one will be to accept a payment with Checkout, which is a nice integration that Stripe provides. Embed Checkout in Laravel 0:38So let's take a look at the documentation. And step one will be to accept a payment with Checkout, which is a nice integration that Stripe provides. It'll do most of the work for you. It's really cool. So we're going to set up something like that. Okay, so to begin, all we have to do is embed this form. Let's try it. Let's create a new Laravel app called Billing. CD in there, open this up in Sublime. And to get started as quickly as possible, we're just going to use the welcome page that Laravel provides. So we can get rid of all of this junk right here, and then all of that junk. And then I will paste this in. Great.So we can get rid of all of this junk right here, and then all of that junk. And then I will paste this in. Great. So let's give it a very quick and dirty heading, like Buy My Book, or something like that, for $25. And we'll take a look at this in the browser. Now, I have Laravel Valet installed, so that means I can go to my project.dev, and here it is. So if we click on it, yeah, take a look. It just works right out of the box. This is really, really nice. They've done a great job here. But now, how does everything get populated? You'll see that with this integration, we use data attributes. So the data key, we're going to talk about that in a minute.You'll see that with this integration, we use data attributes. So the data key, we're going to talk about that in a minute. The amount, this will be in cents. And generally, it's kind of a good practice to charge in cents. So we're going to charge $2,500, or $25. The name will be Some Book. This will give you everything you need to get started. You know, just a little description. You can pass a path to an image that will display. Automatically determine the locale.You can pass a path to an image that will display. Automatically determine the locale. And in this case, I want a zip code, so I'm going to require that. It's not required, by the way, so you can remove that. But generally, for better fraud protection, you will want that. And then if I go back to Chrome, here, I believe we can go to our account settings. And then come down here and select Decline all charges that fail zip code verification. And we could set up CVC as well. Anyways, so yeah, that's all we've got to do there. Now if I give it a refresh, this should set up a charge for $25. Understand token workflow 2:36Anyways, so yeah, that's all we've got to do there. Now if I give it a refresh, this should set up a charge for $25. But now, it's not quite as easy as just filling out this form, and then you instantly have $25 in your account. So it's essential that you understand the basic workflow here. If you are not using Stripe and you were submitting a credit card to your server, there's lots of PCI compliance that you have to be aware of, and it's very dangerous and very, very complicated. So instead, what we do is we take all of that work and we send it over to Stripe so that they can be responsible for the encryption and all of the compliance.So instead, what we do is we take all of that work and we send it over to Stripe so that they can be responsible for the encryption and all of the compliance. But then, Stripe will return to us a unique token. And we can think of that token as not a credit card number, but an identifier for that card. And then you can use that from your server to charge the user's card. And that way, once again, their credit card number will never physically touch your server. So let's try it out. We're going to have a form that submits to something like Purchases. And I'm going to go, I'm using Laravel 5.3 here. I'm going to go to my route slash web file. Create purchases endpoint 3:43And I'm going to go, I'm using Laravel 5.3 here. I'm going to go to my route slash web file. And we'll say, when we get a POST request to Purchases, we could do this inline, of course, but why don't we make it a little more real life and we'll use a Purchases controller and we'll hit a store method. Okay, phpArtisan, make me a controller called PurchasesController. And if I switch over there, down here we'll have a store method. And this is where we will perform the charge. Now, it's possible this is still confusing to you because you're thinking, well, I don't get it. I'm filling out the form here, so why can't Stripe just perform the charge?Now, it's possible this is still confusing to you because you're thinking, well, I don't get it. I'm filling out the form here, so why can't Stripe just perform the charge? And the reason why is because, well, think about it. When you fill this out, it's going to submit an AJAX request to Stripe's server. And if that were the case, the user could potentially manipulate the charge. They could open up Chrome DevTools and change the amount to $2. And then when the request gets sent, they're being charged $2 rather than $25. So instead, we actually want to perform the charge from our server side code. So again, basic workflow. We fill this out. And in fact, let's do this.So again, basic workflow. We fill this out. And in fact, let's do this. When we hit this method, let's die and dump all of the request data. But first, before we try it out, if we go back to that welcome file, well, you may know that Laravel has CSRF protection out of the box. So we always want to make sure that we add a CSRF field to any form. All right. We're going to give this a shot. I will reload. We'll use Jeffrey at laracast.com. Now, for card numbers, there are lots of different test card numbers that Stripe provides.We'll use Jeffrey at laracast.com. Now, for card numbers, there are lots of different test card numbers that Stripe provides. And this way you can test, well, what if there are insufficient funds? What if the number is wrong? What if the number is perfectly valid? All of those are available to you. Now, one that I use a lot is this one here. 4242 repeated four times. That represents a fine, valid number. For anything else, we can use gibberish here.That represents a fine, valid number. For anything else, we can use gibberish here. And the user can even remember their card details. But we'll do this. Okay. So it looks like it submitted a request to Stripe server. Stripe then responded to that request with a unique token. And then what happens is it basically inserts a hidden input into our form here where the name is Stripe token and the value is this. And then it submits the form manually. So now our form has submitted.And then it submits the form manually. So now our form has submitted. This is the data that we have from it. And we have a unique token or identifier that we can then use to charge that card. So again, they use their credit card. It never touches our server. We don't have to worry about PCI compliance. We just get a token that we will then once again submit a second request to Stripe to say, hey, create a customer for me and charge their card. That's the way the cycle works.hey, create a customer for me and charge their card. That's the way the cycle works. So if we now need to submit a second request from our server, we need some kind of Stripe integration, right? And of course, Stripe provides that. And in fact, Laravel even provides that through a very cool package called Cashier that we will review later in the series. So let's go back to documentation, check out, and there should be some integration examples here. There we go. Configure Stripe API keys 6:58and there should be some integration examples here. There we go. We want PHP. And it looks like there is a Stripe PHP library that we can pull in. So we can do that through Composer. Next, if we were to travel back, you'll see that the API is fairly simple. You set your API key. And then down here, you create a new customer and you charge their card. Very, very simple. Let's start with the API key.Very, very simple. Let's start with the API key. If we go back to our dashboard, into account settings, over to API keys, here are mine. And I'm going to have to reset these once I'm done because you never want to share your live secret key. That always needs to be private. So how does this work? Well, we have test keys and live keys. Naturally, live refers to real life where a card is being charged,Well, we have test keys and live keys. Naturally, live refers to real life where a card is being charged, and test refers to, of course, local. Nobody is being charged here. We have test card numbers we can use and stuff like that. So that means for local development, you're going to use these. But for production, you want to make sure that you're using these. So with layer value, you may know that we can handle this really simply. We can go to our environment file. And as a rule of thumb, whenever you have a private keyWe can go to our environment file. And as a rule of thumb, whenever you have a private key or a situation where, for local development, the configuration should be this value, but for production or staging, it needs to be that value. You should always reach for your environment file. We can do this. First, in config services, Laravel includes a little boilerplate here for you to get started. So we're going to reference these.Laravel includes a little boilerplate here for you to get started. So we're going to reference these. It wants a stripe key and a stripe secret. So I will add those down here. Stripe key, and that will be your publishable key, this one. Next, your secret, this is the private key that you don't want to share. Okay? So then, when you push this up to production, you would open up the environment file for your production server, and you would reference these two values instead.you would open up the environment file for your production server, and you would reference these two values instead. Now, if we want to grab those values, we can just say config, we could do something like this. Config, give me the services file, the stripe array, and specifically the key here. And that will give us our publishable key. So let's do that now. Back to our welcome page. And yeah, here, we're hard-coding it,Back to our welcome page. And yeah, here, we're hard-coding it, and Stripe is nice enough to auto-populate that with your actual test publishable key. But we can't do that. We can't hard-code it. So instead, we're going to make it dynamic. Or if you want to pass this from a controller, that would be fine as well. Whatever you want to do there. Create customer and charge 9:38that would be fine as well. Whatever you want to do there. Next, we're moving back to charging the card. And like I said, it's very simple. We set the API key. We create a customer. And this is really good for the situations where you might charge the customer again. So maybe they sign up, and you sell tons of books. And you don't want them to re-enter their credit card dataSo maybe they sign up, and you sell tons of books. And you don't want them to re-enter their credit card data every time they want to purchase a book. Instead, you can create a customer through Stripe, and then for every new charge, you just reference the customer ID. And the customer is attached to a credit card number. So it's all very seamless. Anyways, if we were to put this all in the controller to start, we could do something like this. We need to import Stripe,we could do something like this. We need to import Stripe, but also Stripe slash charge, and Stripe slash customer. So with PHP 7, you could do something like this. Kind of nice. So we can start by setting the API key. Or later, you could put this in a service provider. Or maybe you ultimately set up some kind of gateway class where you could define that even in the constructor if you want.Or maybe you ultimately set up some kind of gateway class where you could define that even in the constructor if you want. Now, for the API key, once again, we can just grab that here. And when it says API key, it wants your secret key. So I could say config services.stripe.secret. Next, I will create a customer. And again, that's so that I can charge that specific customer in the future without requiring their card details again.charge that specific customer in the future without requiring their card details again. So we'll save that. And then in real life, you would store that customer ID in your database. But we're not going to get that far for the opening lesson. Okay, for our customer, we're going to give it the email. And we can grab all of this information through the request. If we switch back, here is what got submitted from our form. So let's do the Stripe email.If we switch back, here is what got submitted from our form. So let's do the Stripe email. And then we're going to specify a source. And this is just Stripe's terminology for the token. Give me the Stripe token that we returned from our servers. So that's the identifier again. It just basically wants to know, give me the card that we're charging. In this case, we can grab it here. And that's the minimum that we need to create a customer.In this case, we can grab it here. And that's the minimum that we need to create a customer. Next, I'm going to create a charge. So again, if you had something like this where if we come back, and within the form, you had like a hidden input where the name is price and the value is $2,500, it's okay for the form if you want to present it to the user. But don't rely on that to actually perform the charge. And again, it's because users could manipulate that form.But don't rely on that to actually perform the charge. And again, it's because users could manipulate that form. And then the input will submit with a value of $1. And then you're trying to charge them for a buck. Don't do that. Instead, maybe refetch the product from the database and then use that value. Never trust the user. In this case, we don't have any products. So we're just going to say the amount should be hard-codedIn this case, we don't have any products. So we're just going to say the amount should be hard-coded at $0.25 or $25. But who are we charging? Well, we're charging this customer. So I could say customer will be the customer's ID that was returned from this. Finally, how are we charging? The currency is going to be in US dollar for me. And that's it.The currency is going to be in US dollar for me. And that's it. Very simple. So in your view, you define a form, you set a CSRF field, and then you use Stripe's checkout integration. And when this form is submitted, Stripe knows to hijack it, submit an AJAX request with the credit card data, encrypt it, filter it, do everything they need to,submit an AJAX request with the credit card data, encrypt it, filter it, do everything they need to, and then it returns a token to you. It inserts that token into the form just like this. Input type equals hidden, name equals Stripe token, value will be what was returned from that AJAX request. Then it manually submits the form to your server. Your server receives something like this. And don't confuse these two tokens. The top one, that is Laravel's CSRF token that it uses.And don't confuse these two tokens. The top one, that is Laravel's CSRF token that it uses. Stripe token is the actual card identifier. Anyways, you use that information to create a customer and charge their card. So generally, you might have this within like a registration controller where they register and you immediately create a customer for the first time. And then later, well, if they have a customer IDfor the first time. And then later, well, if they have a customer ID in your users table, you can just fetch that customer and perform the charge without having to redo this. Okay, so when we're done, we'll just say all done and we can verify it. Go back to the homepage. We're going to buy this book, give it jeffrey at laracast.com.We're going to buy this book, give it jeffrey at laracast.com. I'm going to paste in a valid test card number that they provide. And by the way, go to their documentation to see a bunch of different card numbers you can use. All right, Ajax request. It returned with a token. It inserted it into the form. It submitted the form from our server.It inserted it into the form. It submitted the form from our server. We created a customer using that token. We charged the customer and then we returned all done. So that means if we give this a refresh, we should now see $25 in our balance and it worked. Let's take a look. New payment. Here it is. And also, we created the customerHere it is. And also, we created the customer so we can see all of their information and the card that they have on file. And then finally, our personal balance. Of course, Stripe takes, I think, 2% of the charge or something like that. So ultimately, we get $23.97 out of the deal and that's how you do it. So in the next episode, we'll take another step.and that's how you do it. So in the next episode, we'll take another step.
