How to keep your web app users passwords safe and getting started with authentication in bcrypt

Subscribe to my newsletter and never miss my upcoming articles

Hey there! πŸ‘‹

Hope you guys are having a good day 🌞.

This article is more focused on how user credentials on a website are generated, stored, secured, and authenticated. πŸ” We'll cover it all and will see how to implement bcrypt practically so that you can too follow this approach. πŸ¦Έβ€β™‚οΈ

Be it Instagram, Facebook, Twitter, Github, or any other platform that requires users to signing using a password. Did you ever wonder how you are authenticated? and how your passwords are stored?

Let's first understand what authentication is? πŸ›‘

Let's imagine that you went to a concert πŸŽ‰, their entry was based on tickets. Your ticket has an ID, date, and stamp. And only if those ID, date, and stamp are valid, then you will be granted entry. βœ…

Similar is with websites when you sign in successfully, a unique encrypted token is generated πŸ”‘ which contains some identification information of the user such as - username or email.

Now, this token will grant you access across the website's secured pages. πŸ“„ One of the most commonly used tokens is JSON Web Tokens

  • This is how it looks like when encoded
    eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c
    
  • Decoded: (payload)
    {
    "sub": "1234567890",
    "name": "John Doe",
    "iat": 1516239022
    }
    
    This is pretty much how authentication works. β˜‘

How your passwords are stored?

No, they're not directly stored in the database. ❌

It is first encrypted into a hash using various hashing methods, one of the most popularly used methods is bcrypt. βœ”

  • Whenever a user attempts to log in the entered password is hashed using the same hashing algorithm and is compared with the currently stored hashed-password in the database.

Let's say the company had a bad day and their database gets breached by hackers. In this situation at least the user's original credentials are still protected and non-disclosed.🀫 Which prevents the worst case to happen. Therefore, it's always advisable to don't store plain text passwords in the database. Instead, store it in as an encrypted or hashed form.

A practical usage of bcrypt in javascript

  1. Setting up bcrypt (javascript)

    const bcrypt = require('bcrypt');
    const saltRounds = 10;
    const myCorrectPlaintextPassword = 's0/\/\P4$$w0rD';
    const notCorrectPlaintextPassword = 'this_is_incorrect_password';
    
  2. Hashing passwords, here we are generating a salt and then using that salt to hash the password

    const salt = bcrypt.genSaltSync(saltRounds);
    const hash = bcrypt.hashSync(myCorrectPlaintextPassword, salt);
    // Store hash in your password DB.
    
  3. Checking password when a user attempts to log in.

    // Load hash from your password DB.
    bcrypt.compare(myCorrectPlaintextPassword, hash).then(function(result) {
     // result == true
     // access granted
    });
    bcrypt.compare(notCorrectPlaintextPassword, hash).then(function(result) {
     // result == false
     // access denied
    });
    
  4. That's all! Setting up authentication using bcrypt was that simple! πŸ₯³πŸŽ‰

Feel free to reach me on Twitter @amaancodes for any query. Happy to help πŸ˜„πŸ€

Lastly, don't forget to drop your views about this article in the comments! πŸ’­ See ya!

No Comments Yet