Introducing Single Charges0:00
Okay. Let's take a look at single charges in Cashier. Sometimes you don't want to have a subscription and just make a one-off charge. So as you see, we can make use of the charge method here, and it also takes a payment method. And we also have to make some changes on the front end. So let's see how we can do that. So I'm going to make a new section here for just single charge. So let's start with that. So back to our navigation. Let's add one more here. And I'm not going to wrap it in any auth. So we'll just put it here. And let's call
Adding Charge Routes0:29
Let's add one more here. And I'm not going to wrap it in any auth. So we'll just put it here. And let's call it charge. Okay. And let's add that to our routes file. So let's copy these two, because we need the Vue, or the GET request, as well as the POST request as well. So let's do that. Let's change it to charge. Okay. And same with this one. charge.post. Okay.
Creating Charge View1:01
Okay. And same with this one. Charge.post. Okay. And let's go ahead and make a view for that. So I'm just going to duplicate the subscribe view and just change it up a bit. So let's duplicate it. charge.blade.php. Change this to charge. And we still need a form, but we don't need this selection for the plan anymore. So let's just put something up here. So this is usually where the description of the product goes and the price.
Capturing Payment Method3:11
And our card element is just called card. And instead of the setupIntent, we are now getting the paymentMethod here. And this stays the same for validation. And we can pass it in here. paymentMethod. Actually, before we do that, let's just console.log it like I did before. console.log paymentMethod. And let's see if we get anything. Okay. Back here. Let's refresh. Make sure there's no errors. And let's just fill this out.
Make sure there's no errors. And let's just fill this out. Mesh for two, as always. Okay. And let's see if we get anything here. Sorry. And we do. And as you see, now the ID is the string or the token that we need to be passed through to the backend. So we're passing in the paymentMethod. That's good. And now we just have to make one change to our method here. So now we're taking in the paymentMethod.
change to our method here. So now we're taking in the paymentMethod. And we want to set the attribute or the hidden attribute to paymentMethod.id. Okay. And now that should be passed through to the backend. So now we can make use of that charge method. So let's see. Single charge here. Yeah. So it's just User charge the amount in cents, which I'll just hard code and the paymentMethod, which is being passed through. So
Implementing Backend Charge4:47
the amount in cents, which I'll just hard code and the payment method, which is being passed through. So back to our routes file. We just have to change this to this new thing. So off user charge. And let's just put $10 in here. And the payment method is $request->paymentMethod. Okay. Oops. This should be user as a function. And hopefully I did everything correctly.
Oops. This should be user as a function. And hopefully I did everything correctly. And we should be able to make that one off charge. Refresh. And again, I'm going to fill this out and mash for two. And let's see if this works. Okay. Missing required per Ram items. So the problem is I forgot to change the endpoint. So it should be charge that Post. And I'm also going to get rid of these middleware.
So it should be charge that Post. And I'm also going to get rid of these middleware here. Okay. And let's see if this works. Let's try again. Fresh just in case. And I'm going to migrate for two again. And let's see if this works. Okay. So it redirected back to the dashboard. Let's check our endpoint here and let's check payments. There should be a new one here. And this is the one that was successfully charged. So
Debugging Stripe Customer State6:55
and this was just because I had some errors in my code. So it actually doesn't create a new User. So let's verify that again. So I'm going to delete this. Okay. So that User is gone. Let's make another charge here. And it's going to mash for two one more time. And this should go through. And it looks like it's looking for the customer. Sorry about that. It thinks there is an existing customer because I had that incorrect endpoint. So let's go to my database and let's just force it back to null. So it thinks there is a User in Stripe. So the column ID for that is here. So let's just put it back
there should be no new customer here. So yes, just to verify, let me refresh again. And there is no new customer here. So if you do want a new customer, you can do it manually, which we'll actually take a look at in the next video because I want to take a look at invoices as well. So I'm going to use this method. But this method requires you to create a new User in Stripe and attach a payment method to them. So yeah, we'll take a look at that in the next video.
