Merge pull request #6 from FACN1/loginpage

Loginpage

package.json

@@ -8,12 +8,16 @@
   "main": "index.js",
   "dependencies": {
     "env2": "^2.1.1",
-    "pg": "^6.1.5",
     "handlebars": "^4.0.6",
     "hapi": "^16.1.1",
+    "hapi-auth-cookie": "^7.0.0",
+    "hapi-auth-jwt2": "^7.2.4",
     "inert": "^4.2.0",
-    "vision": "^4.1.1",
-    "tape": "^4.6.3"
+    "jsonwebtoken": "^7.3.0",
+    "pg": "^6.1.5",
+    "request": "^2.81.0",
+    "tape": "^4.6.3",
+    "vision": "^4.1.1"
   },
   "devDependencies": {
     "eslint": "^3.19.0",

public/style.css

@@ -47,4 +47,13 @@ header {
 
 .content-wrapper {
   margin-top: 100px;
+  text-align: center;
+}
+
+.login-button {
+  margin: 10rem 5rem 5rem 5rem;
+  width: 10rem;
+  height: 4rem;
+  border: 2px solid gray;
+  border-radius: 10%;
 }

src/router.js

@@ -1,5 +1,9 @@
 const path = require('path');
+require('env2')('./config.env');
 const dbQueries = require('./db_queries.js');
+const querystring = require('querystring');
+const requestModule = require('request');
+const jwt = require('jsonwebtoken');
 
 const staticFiles = {
   method: 'GET',
@@ -11,22 +15,122 @@ const staticFiles = {
   }
 };
 
-const index = {
+const loginButton = {
   method: 'GET',
   path: '/',
   handler: (request, reply) => {
-    dbQueries.getPosts((err, postsArray) => {
-      if (err) {
-        return reply(err);
+    const loginContent = {
+      text: 'Login'
+    };
+    return reply.view('login-btn', loginContent);
+  }
+};
+
+// Send user to github to authenticate with github and grant permission.
+// Then redirect back to '/welcome' route
+const githubOAuth = {
+  method: 'GET',
+  path: '/login',
+  handler: (request, reply) => {
+    const base = 'https://github.com/login/oauth/authorize?';
+    const oAuthParams = {
+      client_id: process.env.CLIENT_ID,
+      redirect_uri: 'http://localhost:4040/welcome'
+    };
+    const authReqUrl = base + querystring.stringify(oAuthParams);
+    reply.redirect(authReqUrl);
+  }
+};
+
+const welcome = {
+  method: 'GET',
+  path: '/welcome',
+  handler: (request, reply) => {
+    const data = {
+      client_id: process.env.CLIENT_ID,
+      client_secret: process.env.CLIENT_SECRET,
+      code: request.query.code
+    };
+    const options = {
+      method: 'POST',
+      body: data,
+      json: true,
+      url: 'https://github.com/login/oauth/access_token'
+    };
+    // make a post request with temp Code
+    requestModule(options, (error, response, body) => {
+      if (error) return reply(error);
+
+      const myToken = body.access_token;
+
+      if (!body.access_token) {
+        return reply('no access token found');
       }
-      const context = {
-        posts: postsArray.reverse()
-      };
-      return reply.view('index', context);
+
+      return requestModule.get({
+        url: 'https://api.github.com/user',
+        headers: {
+          'User-Agent': 'oauth_github_jwt',
+          Authorization: `token ${body.access_token}`
+        }
+      },
+      (getError, getResponse, getBody) => {
+        const JWTOptions = {
+          expiresIn: Date.now() + (24 * 60 * 60 * 1000),
+          subject: 'github-data'
+        };
+        const parsedBody = getBody;
+
+        const payload = {
+          user: {
+            username: parsedBody.login,
+            img_url: parsedBody.avatar_url,
+            user_id: parsedBody.id
+          },
+          accessToken: myToken
+        };
+
+        const secret = process.env.SECRET;
+
+        jwt.sign(payload, secret, JWTOptions, (jwterror, token) => {
+          if (jwterror) throw jwterror;
+          return reply.redirect('/home').state('token', token, {
+            path: '/home',
+            isHttpOnly: false,
+            isSecure: process.env.NODE_ENV === 'PRODUCTION'
+          });
+        });
+      }
+      );
     });
   }
 };
 
+const index = {
+  method: 'GET',
+  path: '/home',
+  config: {
+    auth: {
+      mode: 'optional',
+      strategy: 'jwt'
+    }
+  },
+  handler: (request, reply) => {
+    if (request.auth.isAuthenticated) {
+      return dbQueries.getPosts((err, postsArray) => {
+        if (err) {
+          return reply(err);
+        }
+        const context = {
+          posts: postsArray.reverse()
+        };
+        return reply.view('index', context);
+      });
+    }
+    return reply.redirect('/');
+  }
+};
+
 const add = {
   method: 'GET',
   path: '/add',
@@ -50,5 +154,5 @@ const createPost = {
 };
 
 module.exports = [
-  staticFiles, index, add, createPost
+  staticFiles, index, add, createPost, loginButton, githubOAuth, welcome
 ];

src/server.js

@@ -3,19 +3,40 @@ const vision = require('vision');
 const routes = require('./router.js');
 const inert = require('inert');
 const handlebars = require('handlebars');
+const hapiAuth = require('hapi-auth-jwt2');
 
 const port = process.env.PORT || 4040;
 
-const server = new hapi.Server();
+const server = new hapi.Server({
+  connections: {
+    state: {
+      isSameSite: 'Lax'
+    }
+  }
+});
 
 
 server.connection({
   port
 });
 
-server.register([inert, vision], (err) => {
+server.register([inert, vision, hapiAuth], (err) => {
   if (err) throw err;
 
+  const validate = (token, validateRequest, callback) => {
+    if (!token) {
+      return callback(null, false);
+    }
+    return callback(null, true);
+  };
+  server.auth.strategy('jwt', 'jwt', {
+    key: process.env.SECRET,
+    validateFunc: validate,
+    verifyOptions: {
+      algorithms: ['HS256']
+    }
+  });
+
   server.views({
     engines: {
       hbs: handlebars

views/login-btn.hbs

@@ -0,0 +1,3 @@
+<a href="/login">
+  <div type="button" name="button" class="login-button">{{text}}</div>  
+</a>