"CSS Basics (2014)" was retired on July 12, 2021. You are now viewing the recommended replacement.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Practice ExpressJS: Middleware!
You have completed Practice ExpressJS: Middleware!
Preview
This video shows my solution to the challenge.
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
Welcome back.
0:00
How did it go?
0:00
If you weren't able to complete
the entire challenge don't worry,
0:02
you can see my solution here and
go back and try it again.
0:06
To get started,
I imported the users array from data.json.
0:09
Then I defined a named export that
provides our middleware function and
0:14
named it authUser.
0:18
I immediately checked if there was a query
on the request object named username,
0:20
and if not, I redirected
the response to the forbidden route.
0:25
Because this conditional statement
only has one action to execute,
0:29
I've omitted the curly braces and
placed it all on one line for readability.
0:33
Next, I defined a variable and
0:37
set it equal to our queries
username forced to lowercase.
0:40
To see if there is a match
between the provided username and
0:44
our mock database I use the find method.
0:48
If you're unfamiliar with find,
it's a very handy tool for us.
0:50
It searches an array for the first
element that satisfies a provided testing
0:55
function, and returns the element,
or undefined if no element is found.
0:59
Check the teacher's notes for a link
to learn more about the find method.
1:04
In this case,
I'm checking my username variable
1:08
against each of the user's names in
data.json forced to lowercase as well.
1:12
Now, I can verify whether the match
variable holds a truthy value using
1:17
the if-match condition.
1:21
In the event of a match,
1:23
I proceed by creating a current user
property on the request object and
1:24
assigning it the value from our
matched object's name property.
1:28
Following this,
I invoke the next function.
1:32
Conversely, if no match is found, I set
the status of the response object to 401
1:35
and send a new message to the user,
indicating that no match was found.
1:40
Awesome, let's finish up in app.js.
1:44
First, I needed to import
my authUser function.
1:48
Then I simply needed to add this to
the two protected routes as the first
1:52
middleware in the stack
directly after the route.
1:56
And that's it.
2:00
Let's double-check that this
all works in the browser.
2:01
Here's the home page.
2:03
I'll try both of our
routes without a username.
2:05
They're both redirecting
us to the forbidden path.
2:09
Perfect.
2:12
Now I'll try them with
an incorrect username
2:14
Great, we're getting our
custom message on both.
2:23
Now I'll try secret with
the correct username and it works.
2:25
And lastly, the settings page.
2:30
We're getting access and
it's printing my username correctly.
2:35
Wonderful.
2:38
Was your solution different than mine?
2:40
If so, that's great.
2:42
It's always nice to see how many different
approaches can be taken to solve
2:43
the same issues when coding.
2:47
I hope you enjoyed this exercise.
2:48
I'll see you next time, and
until then, happy coding.
2:50
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up