Implementing Zxcvbn for your web app is relatively straightforward and can provide significant benefits in terms of password security.
In this tutorial, we’ll cover the steps for integrating Zxcvbn into your app.
Here is an interactive version for you to try out →
- Install Zxcvbn
The first step is to install Zxcvbn, through either
npm install zxcvbn or by downloading the library directly from the GitHub repository.
2. Implement Zxcvbn:
Once Zxcvbn is installed, you’ll need to include it in your app. You can do this by adding the following line of code to your app:
const zxcvbn = require('zxcvbn');
3. Calculate password strength
To calculate the strength of a password, you can use the
zxcvbn function, which takes the password as its input and returns an estimate of the password’s strength.
const password = 'mypassword';
const result = zxcvbn(password);
4. Properties of ‘result’
result.guesses # estimated guesses needed to crack password
result.guesses_log10 # order of magnitude of result.guesses
result.crack_times_seconds # dictionary of back-of-the-envelope crack time
# estimations, in seconds, based on a few scenarios:
# online attack on a service that ratelimits password auth attempts.
# online attack on a service that doesn't ratelimit,
# or where an attacker has outsmarted ratelimiting.
# offline attack. assumes multiple attackers,
# proper user-unique salting, and a slow hash function
# w/ moderate work factor, such as bcrypt, scrypt, PBKDF2.
# offline attack with user-unique salting but a fast hash
# function like SHA-1, SHA-256 or MD5. A wide range of
# reasonable numbers anywhere from one billion - one trillion
# guesses per second, depending on number of cores and machines.
# ballparking at 10B/sec.
result.crack_times_display # same keys as result.crack_times_seconds,
# with friendlier display string values:
# "less than a second", "3 hours", "centuries", etc.
result.score # Integer from 0-4 (useful for implementing a strength bar)
0 # too guessable: risky password. (guesses < 10^3)
1 # very guessable: protection from throttled online attacks. (guesses < 10^6)
2 # somewhat guessable: protection from unthrottled online attacks. (guesses < 10^8)
3 # safely unguessable: moderate protection from offline slow-hash scenario. (guesses < 10^10)
4 # very unguessable: strong protection from offline slow-hash scenario. (guesses >= 10^10)
result.feedback # verbal feedback to help choose better passwords. set when score <= 2.
result.feedback.warning # explains what's wrong, eg. 'this is a top-10 common password'.
# not always set -- sometimes an empty string
result.feedback.suggestions # a possibly-empty list of suggestions to help choose a less
# guessable password. eg. 'Add another word or two'
result.sequence # the list of patterns that zxcvbn based the
# guess calculation on.
result.calc_time # how long it took zxcvbn to calculate an answer,
# in milliseconds.
My Twitter: https://twitter.com/AdamJSturge
Interactive Application: https://lowe.github.io/tryzxcvbn/
If you enjoy reading stories like these and want to support me as a writer, consider signing up to become a Medium member. It’s $5 a month, giving you unlimited access to thousands of articles, including my own. If you sign up using my link, I’ll earn a small commission with no extra cost to you.