Hey there, everyone.
They share.
And welcome to another video.
In this video, we're going to design our own custom middleware.
And this only video will have will give you so much of clarity about middleware, how to use them,
what role they do play, a whole bunch of other things as well.
It's going to be super, super easy.
So let's go ahead and see that how we can actually go ahead and work on with that.
So here's our route, really simple dashboard.
We send a request to that.
We are able to get the secret information.
Now, a couple of things that you should really know about how the data actually travels.
There are a lot of places, how it travels in the headers.
There is now an authorization section which you don't really need that much.
You can just get away with just the headers, but it can also travel via cookies and a whole bunch of
bodies, a whole bunch of other things.
So we need to take care of all of them in case this is our application design.
In case your application design, expect the data just from the headers or maybe just from the body
or just from the cookie.
You can just remove the code at that time.
So pretty good.
So let's go ahead and write that.
Now, writing a simple middleware is not that tough.
It's actually super easy.
It just like defining a method itself, nothing more than that.
So I'm going to go into JS and there we go.
Now if you notice closely in the strategy, it says Verify the token.
Verification of the token can only be done by the JSON.
We saw that in the documentation part as well, that there are a lot of methods given to us.
So if I go back up here a little bit, I can go ahead and definitely sign the token, but I can also
go ahead and verify my token.
If I scroll a little bit more, you can see that there is a verification.
Of course I have to pass in the token and my secret information.
And further down you can also go ahead and use a callback.
We won't be doing that much, so let's go back up here first.
Let's go ahead and say that I want to have a JWT, which obviously is going to be coming up from the
package that we have installed, which is JSON Web token.
Okay.
Now, optionally, you can go ahead and bring in the model as well.
Why you might ask?
I'll explain that that model is optional here.
Okay.
Optional.
There we go.
And I'll tell you a couple of strategies that a lot of people follow so that it gives you a more clear
and open minded idea about that.
So don't you worry on that part.
So let's go ahead and call this one as simply auth, feel free to call it as a result is logged in whatever
makes sense.
Whatever gives you more clarity on that.
I think auth is pretty good or is ought is also a great name.
So this is how it's going to work.
We are going to have a request.
We are going to have a response.
And most importantly, don't forget that next is the most important thing.
Without the next, this application is not going to work.
Now, another most important thing is how we are going to grab that token.
This is the most important information.
Let me first tell you how the token actually traveled.
That will give us more information of how to do that.
Now, the most common way of traveling the token itself is first, let's grab the token.
And by the way, I can go ahead and click on this login route and you can use the save as in fact just
open up a new tag and write the dashboard in it, send a get request and then click on the save as the
dropdown button, save as.
And now you can go ahead and save this one.
So what you're going to name, you can just replace that to dash board and then select you won't be
having a workspaces and much of the application being designed if there is you can just click on that
and then you can save this.
Now it will give you here.
So a quick access you can get registered and all of that.
So this is always a good idea.
So let's go ahead and send that.
So how these tokens actually travel, they travel usually via the headers.
You come up here and you write simply authorization.
So this is exact word that is being placed inside the header.
Now, the token that you are getting here, you need to actually copy that.
Without the codes I won't repeat, I will repeat without the codes.
So copy this and I'll go back to the dashboard and then you write a very special key keyword which is
be browser and again really important.
You need to write that if you'll go on to the website of JWT, they will also mention that.
So let me go ahead and bring back.
So let me open up Google JWT, please open the main website JWT IO and you're going to see this exact
same information that how to pass on this.
So I think inside the introduction.
So that you never actually forget that part.
So this is the information and how it works.
So notice here it says this is the authorization.
Then you have to write the keyword bearer and then you have to pass on the token.
This is how exactly the format works and even in case you use any old service or anything, this is
how exactly you have to use all that time in case this is passing.
So notice here we have written the beta, put up a space and then pays the token as it is.
I know this sounds weird, but this is how mostly it travels now.
This is even so much of a common syntax that they have even done the abstraction on here in the Postman.
If you'll go to the authorization section and click on dropdown now even you can select the beta token
and directly just paste the token here.
Now this actually is a little bit bad for the developers that hiding this much information, but it's
good for testers.
So that is why it is there.
I'm going to go ahead and remove this now and I'll also remove it from here as well that we don't want
to have it as of now and I'll even check mark that.
Let's even close that.
Yeah, that's good.
Okay.
Now that you have this much information, what we are going to do with this information, now we know
exactly where to look for the token, the most common place, which is the header itself.
So we're going to say, hey, I want to access the request.
And inside that I want to go ahead and get the access of header.
Which header specifically you might ask?
I want to go ahead and access the header which says authorization and this needs to be spelled up very
carefully and I need to do pay special attention there because I make a lot of typo now in this authorization.
As soon as you're going to get you will get bearer space and the token you don't need all of that,
you just need the token part.
So you have to use a little bit of the JavaScript and you will say, I want to replace it with something.
Now what do you want to replace it?
I want to replace the only part which says, let's just say be aware because I know this is how it always
comes in and there is a space after that as well.
And I want to replace that part only with nothing.
So that's how you do it.
Now, in the ideal case, or hopefully you have actually grabbed the axis of the authorization token,
but this is the one place only we have to take care of other places.
So we're going to use an R syntax and now let's go ahead and see that the token actually come up into
the cookies as well, and we're going to name that as token.
Again, it's your application.
You need to make a flow of that and it can come up into a couple of other places.
Let me go ahead and move that.
It can also come up into a couple of other places apart from token, maybe it's coming up into the body
itself.
Really weird, but I have seen it coming up into the body as well.
So request body token again, if you don't support that, just go ahead and remove this code.
And similarly you get the idea it might come up into token cookie header a bunch of other places as
well.
Maybe it's coming up into URL, maybe that's a password reset you are bringing in, so that's up to
you.
Anyways, once we have grabbed the token, we are pretty sure that the token is there.
We can also make a couple of more code here that if the token is undefined or the authorization is undefined,
we can pass on different errors.
Anyways, it's your application.
Okay.
We're going to worry just about one case that if the token is not present, if the token is not present,
I'm going to go ahead and simply return that resource status.
I'm going to go ahead and return with 403 and we'll simply go ahead and send I can send a JSON response,
but I'm going to say in this case token is missing.
That makes sense in this case.
Now, most importantly, notice here, I'm not using the next this next should be used in this case.
I don't need to because I'm just returning the application and it's not working further down the road.
Otherwise, if this would be case, I would be actually going ahead and giving message to the user to
block it or something.
But in this case, I'm going to just go ahead and exit the application just right here.
Once this is there, I'm pretty sure that the token is here by now.
So I'm going to go ahead and use the tri catch block and in the catch block, I'm going to go ahead
and say I'm going to simply go ahead in the try block.
I will verify the token in case the token is not verified.
That case I'll handle in the catch.
So let's first handle the catch port.
So in this case, let's go ahead and simply return address dot status.
And this time the status is going to be 4 to 1 because a bad thing is being passed on to us in the back
end.
So we're going to simply say send and we're going to simply say invalid token.
Okay, nice.
Now let's handle the tripod.
So we have a token, but we don't know whether this token is verified or not.
So we need to verify that.
How we can do that.
Of course, with the JWT, JWT simply gives us that, hey, you can use a verify method to verify the
token.
Just give me the token directly to token.
Okay.
What else do you need?
I need your secrets.
So I'm going to say process dot, envy dot, whatever we call our secret.
Secret key.
Yeah.
There we go.
And Dot.
OC what this is going to return us.
I have no idea what it will return me.
So I'm going to go ahead and call this one as decode.
But I have at this point, I have no idea what this is.
So I'm going to go ahead and simply go ahead and console.log this that hey, just print this information,
whatever this is, and I'll figure it out later on.
What is going to happen with this information?
Okay.
After that, I'm going to go ahead and simply return next.
This is the most important part and this usually goes at the end of your project or your line that,
hey, no matter what happens, I need to pass on this thing into the next one.
Remember, the video of the middleware we talked about is logged in next?
Yeah, exactly that.
Okay.
So this is all done now how you're going to work with that.
This method needs to be imported wherever you want to use it.
So first, obviously we need to export that.
So we're going to go ahead and say module dot exports and let's go ahead and simply export this auth.
Nice.
We will come back onto this method.
But again, let me quickly summarize that.
We first are hunting for token at multiple places.
You might head for one place and then we are saying if the token is not present, we will not allow
you to go further.
We'll just end it here by returning a response here.
Now, in case the token is there, then we are simply going ahead and use JWT to decode the information
whatever is present in the token.
I have no idea what that is.
And in that, in the other case, the token is not a valid token.
Okay, good.
Now moving on to the app dogs.
Let's import this just like we have imported other stuff.
So let's go ahead and say, hey, I want to import this auth method which is going to come up from require
and this time this is going to come up from the same directory.
We have middleware and inside that we have.
AUTH How do we use this?
Auth This really, really simple.
You go ahead wherever you are defining your route, you go ahead and add this as a middleware and that's
it.
I told you it happens in between.
So if you want to check up for admin as well, you can go ahead and say is admin.
So you can define more middleware like this as many as you wish.
In this case, this is the auth that we want to have and a comma, don't forget that.
So this is all what we have done so far.
Let's go ahead and check that whether it is working or not.
If I go ahead and send this information right now, now notice we are not able to get the secret information,
but we are seeing an error which says cannot read the property.
Of course these errors should be handled more better way.
Right now, throwing up just an error like this is not a good.
But still we are actually stopping the user there and we are throwing up an error there and all the
response code and everything, we can actually make it a little bit more polished, which surely we
will do in the next section.
But this is good.
Now let's go ahead and see if we are able to log in.
Now first, I'm going to go ahead and grab this token which is still valid.
It's not 2 hours yet.
Make sure you carefully copy this because the codes are not allowed.
Let's go into the headers of dashboard, make sure you are the dashboard and here we are going to go
ahead and say, hey, I want to use authorization.
And for that I'm going to go ahead and pass on beta and then whatever the token is there, if the token
is also there in the header, let's go ahead and send this.
Now I'm able to get the secret information.
This is so common of a thing.
Let me show you a couple of more stuff in the cookies.
I go ahead and send this up and there we go again.
We get a problem.
Now this authorization and beta so common that if I go into authorization and select my beta token,
which is not digest token, beta token, I go ahead and paste this token as it is without even saying
beta, it will still just do exactly same thing because the information that is traveling is exactly
the same.
Moving on to the code part.
Okay, so now we know how the middleware works, but I have still no information about what this decode
is.
If I go ahead and look into the console, apart from a whole lot of errors, now we are seeing that
this is all the information that is coming up.
We are not going to discuss too much about the i ate and the expiration date because that is already
mentioned in the documentation.
If you remember when we were creating the token, we did send a payload.
This is exactly what is getting as decoded.
So the user ID is coming up to me nicely and also the email is coming in now.
What do you want to do with this?
It's totally up to you.
I'll tell you most common way how it is being done now sometimes.
In fact, most of the time you're going to create that in the request.
Whatever the request is going on further down the road, I'll add a property to this.
Remember, we have requested headers, cookies you can add in your properties as well.
No issue in that in the request of the user.
I want to just go ahead and add this information with whatever the information is there in the decode.
So that is one way of doing that.
Another thing that you can go ahead and do here is you can actually bring in info from DB.
Also, maybe you are just passing on a user ID and later on you decided that, hey, we want to bring
in more information into the request dot user, maybe email ID, maybe his username also and maybe more.
So in that case, you can just quickly bring up your DB up here and can can find the username with the
email and then add mode in.
Information to this request or user.
Pretty easy.
Pretty easy work to go ahead and do that.
Okay.
So this is all now you understand quite in depth about what our middleware they are just something that
happens in between.
You can stop the entire execution flow of the application based on if that thing is not present or you
can just do something different.
What is there?
Okay, quite a lot.
Let's go ahead and catch up in the next video.