OAuth Integration Using Hapi

Originally published at: http://www.sitepoint.com/oauth-integration-using-hapi/

Securing web resources is often a difficult and daunting task. So much so, that it is often left until the last phase of development and then it’s rushed an not done properly. It’s understandable though; security is a very specialized field in development and most people only give it a passing thought – “yeah this should probably be secured…” So then the developers quickly slap together an ad-hoc security method:

if (password === "password1") {
  setCookie();
}
else {
  send(401);
}

and ship the product full of security holes. That snippet is, hopefully, a gross oversimplification, but the point is still valid.

Thankfully, there are developers out there who spend a lot of their time trying to secure websites and web resources and we can lean on their expertise to help us secure our own projects without having to reinvent the wheel.

In this article, we are going to walk through using OAuth tokens to authenticate users via their GitHub credentials. All of those words together probably sounds extremely difficult, but thanks to a few well documented modules, I think you’ll be surprised how easy it really is.

Prerequisites

It is assumed that the reader: 1. has a functional understanding of working with the hapi server framework. 2. has built web resources in the past. 3. has basic understanding of cookies. 4. has a GitHub account. 5. has a rudimentary understanding of what Oath is and what it is used for (you could start by reading the Wikipedia Article about it).

If any of these assumptions are not true, you are strongly urged to get a handle on the listed prerequisites first, and them come back to learn about securing your webpage.

Getting Started

The first thing you’ll need to do is create a GitHub application. This process will net you both ClientID and ClientSecret – both values you will need to set up OAuth on your web server.

  1. Log into your GitHub account and head over to the settings page (https://github.com/settings/profile)
  2. Click on “Applications”
  3. Push the “Generate new application” button and you will be navigated to a new screen that looks like this:
  4. Application Name and Application Description can be anything you want. For Homepage URL and Authorization callback URL, let’s set those to the local server we will be working with. In my example, I will be using port 9001, so set both values to “http://localhost:9001″. My full setup looks like this:
  5. After you push “Register application”, you will be redirected to a new screen that will list both the ClientID and ClientSecret. Make note of these values for later.

Summary

This step was purely administrative. We created a new GitHub application that users will be asked about when they try to log in to your site. Rather than trust http://localhost:9001 with our GitHub credentials, we will trust the GitHub application to authenticate users, and then call back to our website when it’s done.

Planning the Server

Before we start coding, lets come up with a rough outline of what we want our server to do. We will start with four routes for the sake of simplicity: a home route, an account information route, a login route, and a logout route.

In the home route, if the user has been authenticated, let’s print their name, otherwise a generic message. Fo the account route, we will show all the information GitHub sends us. If the user requests the account page without being authenticated first, we will respond with the proper status code of 401. The login route will reach out to GitHub, ask the user for their permission to allow our GitHub application access to some of their account information, and then come back to our local web server. Finally, the logout route will log the user out of our website.

Server Skeleton

Let’s get the boilerplate and routes configuration out of the way first.

Continue reading this article on SitePoint

Hi there, this is a fantastic and clear tutorial. I’ve got a problem however and I’m wondering if you could give me suggestions. My session.clear is working, however upon logging in again, it automatically detects my github account again.

I was wondering if it’s a github thing because logging out manually on github clearly solves this but defeats the purpose of this tutorial. Any suggestions?

If you want to see the full lifecycle again, you need to go into your GitHub account settings and delete the example app. This will force the app to re-authenticate back to GitHub again. Even with this small hiccup, I don’t think it defeats the purpose of this tutorial.

Hello,
thanks for this nice and neat tutorial.

Now let’s say i want to build a private website with only a selected few people (my team) to access to it and that i need to have different roles for different people.
How do i get it done ? Shall i build a local repository (table) to map users and their roles ? or is this something i can do in GitHub, google, … ? If i need to add this extra check, what would be the proper key to link the authorized user from the OAuth2 server and my local table ? the email, token, … ?
And where shall i plug this in the code ?

Sorry it might be just too much questions … but that’s the one i have in mind

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.