A Crash Course to Two-Factor Authentication

April 24, 2023

970 words

Post contents

A Crash Course to Two-Factor Authentication

Two-Factor Authentication (2FA) is a security feature that adds an extra layer of protection to your online accounts by requiring two separate authentication methods to verify your identity.

How 2FA Works

Two-factor authentication works on the principle of using two of the three main authentication factors:

  • Something you know: This could be your password, a PIN, or a security question.

  • Something you have: This could be a mobile phone, a hardware token, or a smart card.

  • Something you are: This could be a biometric factor such as your fingerprint, your face, or your voice.

In order to successfully authenticate, the user must provide both factors. For example, if you're logging into a website with 2FA enabled, you may be prompted to enter your password as well as a code that is sent to your mobile phone via SMS or generated by an authentication app.

TOTP Explained

TOTP is a Time-based One-Time Password algorithm that generates a unique code every few seconds. The code is generated using a secret key and the current time. The secret key is stored on the user's mobile phone or hardware token, and the code is sent to the user's mobile phone via SMS or generated by an authentication app. Simple enough, right?

Why 2FA is Important

Two-factor authentication is important because it adds an extra layer of security to your online accounts. If your password is compromised, an attacker will still need access to your mobile phone or hardware token in order to access your account. This makes it much harder for an attacker to gain access to your account.

Javascript Implementation

We will need to do some initial setup before we can implement 2FA in our Node.js application. We're going to use the Google Authentication Strategy. This strategy uses the TOTP algorithm to generate a unique code every 30 seconds. We will input this code into an input field on our login form. If the code is valid, we will be redirected to the home page. If the code is invalid, we will be redirected to the login page.

Step 1: Create a Google Account (Optional)

We'll need have or create a google account.

Step 2: Install Google Authenticator (Optional)

Install the Google Authenticator mobile app. Android and iOS.

This app will generate the TOTP codes that we will use to verify the user's identity.

Step 3: Install Passport Dependencies

In an existing Node.js project we'll need to install Passport Dependencies

npm install passport-2fa-totp

Step 4: Configure Passport.

Create a new file called passport.js in the root directory of your Node.js application. Then, add the following code to the file:

var GoogleAuthenticator = require('passport-2fa-totp').GoogeAuthenticator;var TwoFAStartegy = require('passport-2fa-totp').Strategy;...passport.use(new TwoFAStartegy(function (username, password, done) {    // 1st step verification: username and password    User.findOne({ username: username }, function (err, user) {        if (err) { return done(err); }        if (!user) { return done(null, false); }        if (!user.verifyPassword(password)) { return done(null, false); }        return done(null, user);    });}, function (user, done) {    // 2nd step verification: TOTP code from Google Authenticator    if (!user.secret) {        done(new Error("Google Authenticator is not setup yet."));    } else {        // Google Authenticator uses 30 seconds key period        // https://github.com/google/google-authenticator/wiki/Key-Uri-Format        var secret = GoogleAuthenticator.decodeSecret(user.secret);        done(null, secret, 30);    }}));

Step 5: Configure Routes.

We will need to route the user to the login form and the home page. We will also need to route the user to the login form if the login fails. Add the following code to the app.js file or the file where you configure your routes:

// This route will render the login formapp.get("/login", function (req, res) {  res.render("login");});// This route will render the home pageapp.get("/", function (req, res) {  res.render("home");});// This route will render the login formapp.post(  "/login",  passport.authenticate("2fa-totp", { failureRedirect: "/login" }),  function (req, res) {    res.redirect("/");  });

Step 6: Configure Views

We can then create a component that will render the login form. The framework you are using will strongly influence the way you implement this component. The following code is an example of how you might implement a login form using HTML elements:

<form action="/login" method="post">  <div>    <label>Username:</label>    <input type="text" name="username" />  </div>  <div>    <label>Password:</label>    <input type="password" name="password" />  </div>  <div>    <label>Google Authenticator Code:</label>    <input type="text" name="code" />  </div>  <div>    <input type="submit" value="Log In" />  </div></form>

Configure Routes

We need to configure routes based on successful or failed login attempt. We will need to create a route for the user to enter their username, password, and TOTP code. If the user successfully authenticates, we will redirect them to the home page. If the user fails to authenticate, we will redirect them to the login page.

Create a new file called routes.js in the root directory of your Node.js application. Then, add the following code to the file:

app.post('/', passport.authenticate('2fa-totp', {    successRedirect: '/',    failureRedirect: '/login'}));

Configure Views

We can then create a component that will render the login form. The framework you are using will strongly influence the way you implement this component. The following code is an example of how you might implement a login form using HTML elements:

<form action="/login" method="post">    <div>        <label>Username:</label>        <input type="text" name="username" />    </div>    <div>        <label>Password:</label>        <input type="password" name="password" />    </div>    <div>        <label>Google Authenticator Code:</label>        <input type="text" name="code" />    </div>    <div>        <input type="submit" value="Log In" />    </div></form>

Outro

Two-factor authentication is a security measure that requires two different methods of authentication to access a system. Security doesn't have to be complicated. In fact, it can be as simple as using a mobile app to generate a unique code every few seconds.

Subscribe to our newsletter!

Subscribe to our newsletter to get updates on new content we create, events we have coming up, and more! We'll make sure not to spam you and provide good insights to the content we have.