Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
There's lots of great Express middleware to choose from — we've used body parser and express-session in this project. But you don't need to rely on other programmers for middleware. You can write your own, and in this video, you'll learn how.
The loggedOut( ) middleware function
function loggedOut(req, res, next) {
if (req.session && req.session.userId) {
return res.redirect('/profile');
}
return next();
}
Using the middleware in a route
// GET /login
router.get('/login', mid.loggedOut, function(req, res, next) {
return res.render('login', { title: 'Log In'});
});
-
0:00
We've included various third party middleware in our application like
-
0:04
Body Parser and Express Sessions.
-
0:06
The cool thing is you don't need to just rely on someone else to create
-
0:09
the functionality your application needs.
-
0:12
You can write your own middleware to extend Express and
-
0:15
in this, in the next video we'll do just that.
-
0:18
We'll create two pieces of middleware.
-
0:20
One that will present an error to users who aren't logged in.
-
0:24
This will let us easily password protect any page on our site with a simple call to
-
0:29
the middleware.
-
0:30
The second middleware function will be for users who are logged in but
-
0:33
are visiting pages that aren't for them like the register page, the logon form or
-
0:38
perhaps some promotional marketing page targeted to just new visitors.
-
0:42
In this video, we'll tackle that last function first.
-
0:44
Currently the /login route is a form that's visible to anyone,
-
0:50
including logged in people.
-
0:53
See, I'm logged in now and if I go to /login, I can see the form again.
-
0:58
The same is true for the sign up form.
-
1:03
While this isn't a huge deal, it would be nice to only let non logged in users
-
1:07
see that form and simply redirect logged in users who accidentally visit this
-
1:12
page to somewhere more appropriate like their profile page.
-
1:16
We can do that with our own custom middleware.
-
1:19
In my text editor, I'll open the project.
-
1:22
It's common to keep your middleware code outside of the main application in one or
-
1:27
more separate JavaScript files.
-
1:29
I'll create a directory named middleware.
-
1:37
And in it, I'll add a file named index.js.
-
1:42
I'll add all my middleware code here.
-
1:45
I'm gonna call this function logged out.
-
1:49
It will prevent logged in users from accessing a route.
-
1:53
Middleware functions have access to the three parameters we've discussed,
-
1:59
the request object, the response object and the next function.
-
2:04
The session middleware makes a session object available through the request
-
2:09
object.
-
2:10
So in this function, we can check for a session and a user ID value.
-
2:21
If both of these are true that means the user is logged in to the site.
-
2:26
And if the user is logged in, we'll send them to their profile page.
-
2:34
In other words, we can call this middleware on any route that we don't want
-
2:39
an authorized user to see like a marketing page.
-
2:42
However, if the user is not logged in,
-
2:45
we just pass execution to the next piece of middleware by calling next.
-
2:50
In other words, if the visitor is not logged in this function won't do anything.
-
2:55
Now in order to use this middleware in our application we have to export it.
-
3:00
So at the bottom of this file, We export the function.
-
3:07
Because this is router middleware, we need to require it and
-
3:11
use it in the file defining our routes.
-
3:13
I'll open the index .js file inside the route’s directory.
-
3:19
And then I'll require our middleware, Because this
-
3:24
route's file is in the route’s directory, I need to use dot dot slash to move up and
-
3:30
out of the route folder, then identify the middleware folder.
-
3:34
Requiring a directory by name like this tells Express to load
-
3:38
the index.js file in that directory.
-
3:41
Now to add our middleware, we pass it into a route.
-
3:45
You can do so by referencing it with mid.logged out.
-
3:49
First, let's only show the registration form if the visitor is not logged in.
-
3:54
I’ll addf the middleware inside the get route for register.
-
4:05
You'll see that I literally place this in the middle of the route.
-
4:10
It really is middleware.
-
4:12
I'll do the same for the route that displays the login form.
-
4:20
Let's see how this works.
-
4:21
I'll save these files and switch to my browser.
-
4:24
I have nodemon running, so the changes I made are active.
-
4:27
I'm not currently logged in, so I'll do that first.
-
4:33
Then, I'll go to /login.
-
4:37
This normally displays the log in form but not for me.
-
4:39
It directs me, a logged in user, to my profile.
-
4:43
You can see the same is true if I visit the register route.
-
4:49
See how easy it was to use our middleware?
-
4:51
Just plop it down in a route and it runs when that route is called.
-
4:55
In the next video we'll create a more useful piece of middleware.
-
4:58
I'll call it requires login.
-
5:01
It will determine if the user is logged in by checking for
-
5:04
a session with a user ID property.
-
5:06
If they are logged in, then they just continue on to the next piece of
-
5:10
middleware and eventually to wherever that route leads like the user profile page.
-
5:15
However, if the user isn't logged in,
-
5:17
it will spit out an error saying that the user must be logged in to view the page.
-
5:21
And I've already shown you the basics you need to write and use middleware.
-
5:26
Before you watch the next video, I recommend that you try to create
-
5:30
the requires login middleware function yourself.
-
5:33
Add the code to the index.js file inside the middleware folder.
-
5:37
Then use that middleware in the GET request for the /profile route.
-
5:42
See if you can do it.
-
5:43
If not, no worries.
-
5:45
I'll show you how to do it in the next video.
-
5:47
See you there.
You need to sign up for Treehouse in order to download course files.
Sign up