Gradebook: Login

Code Diff
Code Base

Goal and News

Henceforth the series will be renamed to Gradebook: {feature}. It’s simpler that way. 
The goal of this feature is to make login in function. This means authenticating a users imputed password with the stored password and blocking any request to sites that an unauthorized users shouldn’t see.

The Code


To keep track of who is login in I use a module called Express-Session. The jist of what is does is that after you set it up, you can store any data in the session object of an incoming request object. What you store in the session object is then put into a cookie and pass that from between client and browser. As for security, it’s handled in two ways. First is that the cookie is signed via the secret key you use during the Express-Session set up. Second is that you can encrypt it as long as you are using HTTPS, which you should be. I’m not because this isn’t a production app and getting a certificate is more that I care to do right now. But if your app is going to be used by other people. ADD HTTPS! That said, here is how you add Express-Session

My secret is terrible! If you are using HTTPS, you just have to comment the ‘cookie:{ secure:true }’ line. Now that we have a way of storing session data, I want to define what is endpoints are restricted and what are not. For me this is really simple, if you are NOT authorized you can only access the login API and login page. So first I make a auth.config file specifying all my unsecured items.

Next I want all routes to go through a function which will check to see if a user is either.
A: going to an restricted endpoint
B: going to a restricted endpoint and is also authenticated.

App.all(‘*’) means that everything request to this server will go through the specified function, auth.checkAuth in this case. You want to make sure that the app.all(‘*’) is defined before any other route. Express works on a ‘what comes first fashion’, so order matters. Below is function I am calling on all incoming routes. 

First I see if you are visiting a un-restriction portion of the site, if you are, then I allow you to go ahead. If you are not, I check to see if you have been authenticated. In my simple case, that’s done by checking to see if a session object has a value called ‘auth’ and that value has been set to true. If so, I allow you to once again go ahead. If those two cases fail, then a user is not allowed to view the contents of the endpoint they were trying to reach. So I return a 401 status and a 404 page. Oops that should be a 401 page! I’ll have to fix that later. Now I will add the code that checks the inputed password with the stored password. First I change my login request to call a new login method. If the login request comes back as a success, I also set the auth value in the session object to true

Note* The new login function is also in the same file as the checkAuth function. What the login function does is request the teacher object, then it will use the same encryption on the user imputed password and check to see if that password matches the stored password which was created using the same encryption function when the user registered. I should note that in the code above and the below, I should have checked to make user that the user and pass were not undefined or null. Shame shame on me.

If the user input password and stored password match, the method resolves. If they don’t match, it rejects. In this case the catch function will happen if the teacher.getByUserName method throws it’s own reject. I’ll show you how that can happen next.

Next I add the getByUserName function. This uses the Mongoose api to invoke a lookup to my database. I’m telling it to find One entry whom matches the passed in criteria. In this case, a teacher with the same username as the one the user type. If there is an error the reject function is invoked. Other wise it returns the person._doc which is the teacher object in this case.

So we test! First I want to make sure I can’t access the site unless I am authorized.

Great I can still access this portion of the site even though I haven’t been authenticated. Next I try to access the main page without logging in.

Another success. Now I want to try to login with correct credentials. 

Success! And finally I try to login with a bad username.

Opps! Looks like I didn’t check to see if the person object existed. So I fix that. 

And I try again.



So today I added the backend code to handle the storing of sessions, the authentication of users, and the access of restricted sections of the site. Next time I’ll add the CSS to handle a bad login and some as of yet to be determined feature!

Thanks for reading.

Facebooktwittergoogle_plusredditpinterestlinkedinby feather