All language subtitles for 017 Creating New Bookings on Checkout Success_Downloadly.ir_en

All right.

So let's now create a new booking document in our database

whenever a user successfully purchases a tour.

So we're back here in the booking controller

and in the raw tender,

which creates the checkout sessions, right?

And remember that here we have this success url

and this url is the basis of the functionality

that we're going to implement in this lecture.

So whenever a check out is successful,

the browser will automatically go to this url,

which right now is basically simply our homepage, right?

It's also at this point in time,

so when a checkout is successful that we want to create

a new booking, right?

So basically we want to create a new booking

whenever this url here is accessed.

Now we could now create a new route for this success,

but then we would have to create a whole new page

and that's not really worth it in this case.

And that's because what we're going to do in this lecture

is only a temporary solution anyway

because it's not really secure, okay?

So remember how we said some lectures ago

and that nice diagram that later when a website

is actually deployed on a server we will get access

to the session object once the purchase is completed

using Stripe Webhooks.

And so these webhooks will then be perfect

for us to create a new booking.

Okay?

But for now, since we can't do that yet,

let's use a work around,

which is simply to put the data that we need to create

a new booking right into this url as a query string.

Okay?

And we need to create a query string because Stripe

will just make a get request to this url here,

and so we cannot really send a body or any data with it

except for the query string.

All right?

So let's do that and what we need here is basically

the three required fields in our booking model.

So tour, user,

and price.

So

tour

is equal to

req.params

.tourid

right?

So what did I do here?

So that's correct.

Next up we need the user.

So user,

which is at request

.user

.id.

And finally we need the price,

which is

at tour

.price.

All right.

Now as I said before,

this is of course not secure at all

because right now anyone who knows this url structure here

could simply call it without going through the checkout

process, right?

And so anyone really could just book a tour

without having to pay.

All they'd have to do is to open this url

with the tour, user, and price

and then they would automatically create a new booking

without even paying, okay?

So again, not really secure,

but for now as a work around it works just fine

because not many people will of course will know

that this our success url.

Okay?

Because actually we're going to hide that fact a little bit

in a second, okay?

So let's now create the function that will actually create

the new booking in the database.

So that's going to exports

dot

create

booking

checkout

and it's called create booking checkout

because later on we will also have create booking,

which will then be accessible from our bookings API.

All right.

Anyway.

Here as always.

And let's start by getting our data from the query string.

And so for that I'm going to use the structuring.

So tour,

user,

and price are available at request

.query.

So remember that is the query string.

Then we actually only want to create a new booking

if all of these here are specified.

And so basically we say that if they don't exist

then we turn and go to the next middleware.

So that's our very standard procedure, right?

So we say that if there is no tour and

no user

and

no price.

So basically we require that all on them exist.

And so in that case,

we go to the next middleware.

Now what exactly is the next middleware actually?

Well remember that we want to create a new booking

on this home url.

So this one here.

Because again that is the url that is called

whenever a purchase is successful with Stripe.

And so what we need to do is add this middleware function

that we're creating right now onto the middleware stack

of this route handler.

So what route handler is that?

Well it's in view routes and it is this one,

right?

So that probably sounds a bit confusing.

But again this is the route that will be hit

when a credit card is successfully charged.

And so this is also the point of time where we want

to create a new booking.

And so here is where we need to add that middleware function

so let's actually do that

and require our controller

and now we'll just duplicate this here.

So booking controller and now I will actually edit here

right at the beginning cause it doesn't really matter

if we're logged in or not for this.

So bookingcontroller.get,

or actually dot

create

bookingcheckout.

Give it a save and

okay.

And again this is here just kind of temporary

until we actually have our websites deployed to a server

where we will then be able to create a better solution

for this.

Okay?

So here in the booking controller

it is now time to actually create that new booking.

And so actually we now need to import that model.

So let's do that here.

Booking

and

booking model here as well.

And for some reason here I have these weird path.

So these don't make any sense at all.

I'm not sure why I wrote them like this back then.

So what we have there is exactly the same as this.

But of course this is more readable.

Anyway.

Let's now create that booking.

And so for that we will have to await

booking

.create

with an object

of

tour,

user,

and price.

And that's it.

Now we also need to mark this one here as async

and as always

catchasync.

Okay?

And we're not saving this into any variable

well because we don't really need it.

We're not going to send this back as an API response.

At this point all we want to do here is create

that new document, okay?

Next up we could then say

next, like this.

And so that would then go the next middleware

but that's not really ideal.

So again keep in mind that the next middleware

in the stack is of course this one

and the get overview.

So basically the function that it's going to render

our page.

But remember that this url is all of this.

So all this with all this data here.

And so again that's not secure at all.

And so at least let's make it a little bit more secure,

all right?

And so what we can do here is to basically

redirect the application now to only this

url.

And so basically you're removing the query string

from the original url.

And so actually we're now going to use something

we never used before.

So that's great, right?

So we're going to use redirect.

All right?

So now what we want is the entire url,

but without the query string.

So what we could do is to just

kind of cheat and copy

this here.

But let's make it a bit more elegant.

So what we're doing is request

.theoriginalurl,

which we already used before.

And so that's the entire url basically

from which the request came.

And so now what we need to do is to split it

by the question mark.

Right?

Because that's the divider between the

part that we actually want and the query string.

So if we split this by the question mark,

then we will have an array where the first element is this

and the second element is all of the rest.

So the query string itself.

And so here we take the first element

and so that is then our homepage.

So our route url.

And what redirect here does is basically to create

a new request but to this new url that we passed in there.

All right?

So this will now create yet another request

to our route url.

So we're again gonna hit this route.

And so once more we will hit this middleware here.

So the one that we're just creating.

So for the second time we're going to be hitting that

but now the tour, user, and price are no longer defined.

And so then we will go to the next middleware,

which finally is the get overview handler function,

which then we'll just render the homepage, okay?

Made sense?

So this is kind of circular then.

So basically in the beginning we're gonna hit

this route here.

Then a new booking here is created

and we redirect the application again to this route,

this time without the query string.

And so without the query string

and this middleware,

we passed right to the next one.

And so only then we get to is logged in

and get overview.

All right?

And so that's actually it, all right?

Well that's just right here that this is only temporary

because it's

unsecure.

Everyone can make bookings

without paying.

So again that would be terrible for the business.

Okay, now it's time to test this out.

And so actually I want to do it with that other user

that we created which is jonas@mailsac.

And that's because I want to see if we actually get

that email receipt from Stripe.

So let's log in with that user

onto our website.

So

log out.

Well that's not working.

That's weird.

Let's reload.

And that should be working so let's see

if we have some error in our javascript.

Because that is actually client facing

and we get Stripe is not defined.

Let's see if we have the same error here on this page,

which we shouldn't, right?

And actually it's not there,

but back on all tours.

Yeah, it's there.

So the solution to that is to move it from the tour

basically to all of the pages.

All right?

So for some reason the parcel bundler does it so

that it needs to be

here in the main scope for all of them.

So for all the pages, okay?

So actually let's put that at the bottom

right here before our bundle.

All right?

Try that again and so now we're good to go.

So log out and

that worked.

Now log in.

Of course now our copy is gone.

One two three four.

No, that's not correct.

Test one two three four.

So I guess I changed the password at some point,

so let's try a new password,

which is not working either.

Let's try pass one two three four

and that worked.

So it's not test one two three four,

but pass one two three four.

At least here in my case.

So let's try to book the

let's say the sports lover.

All right.

Down here.

Book tour

and that still works

and that's the expensive one.

(laughs)

So four two four two and then four two

all the way to the end.

Then here's some month and here is some number.

Let's say my entire name here

and now let's hit pay.

And I'll take a look at the url bar.

And indeed we get our homepage so our route url

without any of the query string that we specified before.

So that means that something is working.

So let's take a look at compass and click up here to reload

and we get our bookings collection.

And that's a good sign.

And indeed here we go.

Our very first document is created.

So remember that was that price.

Let's also take a look at the user's id

which is this one ending in eight E three B.

So eight E three B, that's correct.

And I'm assuming that the tour is also going to be correct.

So perfect.

That worked as well

and so now we really have a way of creating bookings

whenever a booking happens with Stripe.

Let's also quickly checkout our dashboards here again.

That's really fun.

And I guess I just have to reload here.

So let's see.

Here is jonas at whatever we named that is.

We've got the sports lover

and

perfect.

That's working now.

And the final task.

Let's now check out mailsac.

Mail

sac

.com

and see if I got my

email there.

And well actually I did not,

but that's not a big deal.

I'm not sure maybe it just doesn't work with test data.

And so for now that's all I have to show you

about Stripe integration.

Now again once a website is deployed,

we will then actually use Stripe Webhooks

in order to create bookings in a more secure

and much better way.

All right?

So let's just again take a minute to recap what we did here.

So basically we added

all the variables that we need to create a new booking

to the success url.

Then we added a new middleware function here to the stack

of that exact route.

So this one here.

And so like this whenever this url here is hit

we will attempt to create a new booking.

All right?

But that new booking is of course only created

when the tour, user, and price are specified in the query.

And so in this middleware function,

if they are specified on the query well then we create

a new booking in here.

Then after that is done we remove the query string

from the url in order to make the whole process

a bit less transparent for the user.

Basically so that whole query string doesn't show up

in our browser's url bar.

And then down here we redirect our application

to this new route url here, okay?

And so this way this middleware here will be skipped

and then our normal homepage will simply get rendered.

All right?

Let's just get rid of this app error here

and the factory we will actually need in the next lecture.

So in that next lecture we will actually take care

of implementing one last piece of our website,

which basically is this page here for my bookings.

And what this page will do is to basically display

one tour card for each of the tours that we have booked.

So looking pretty similar to this homepage,

but only with the tours that the currently logged in user

has booked, all right?

So that's a nice feature for a website, right?

And so let's take care of that in the next one.