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