js判断密码强度的方法

2023年6月10日下午9:12 • JavaScript

下面是我对“JS判断密码强度的方法”的详细讲解：

什么是密码强度

在IT安全中，密码强度通常表示密码难度的大小。密码强度越高，密码的破解难度就越高，数据的安全性就越高。一个安全的密码强度应该至少包括数字、字母和符号，并且长度应该大于8位。

JS 判断密码强度的方法

1. 简单版判断密码强度

最简单的判断密码强度的方法就是根据密码长度来决定密码强度。以下是简单版的JS代码：

function checkPwdLevel(pwd) {
  var level = 0;
  if (pwd.length >= 8) {
    level++;
  }
  if (pwd.match(/([0-9])/)) {
    level++;
  }
  if (pwd.match(/([a-zA-Z])/)) {
    level++;
  }
  if (pwd.match(/([!,%,&,@,#,$,^,*,?,_,~])/)) {
    level++;
  }
  return level;
}

代码中将密码的长度、数字、字母和符号进行了判断，越多符合要求的项，密码的强度就越高。但是这种方法判断较为简单，只是对基础要求进行校验，存在很大的局限性，很容易被攻击者所破解。

2. 综合版判断密码强度

针对简单版判断密码强度的缺陷，综合版的判断密码强度方法更为严谨，它会对密码的组合进行更多的判断，以保证密码强度的安全性。以下是综合版的JS代码：

function checkPwdLevel(pwd) {
  var level = 0;
  if (pwd.length < 6) {
    return 0;
  }
  if (pwd.match(/[a-z]/g)) {
    level++;
  }
  if (pwd.match(/[A-Z]/g)) {
    level++;
  }
  if (pwd.match(/[0-9]/g)) {
    level++;
  }
  if (pwd.match(/[^a-zA-Z0-9]/g)) {
    level++;
  }
  if (pwd.length > 13) {
    level++;
  }
  return level;
}

相对于简单版，综合版增加了字符种类的检查，还在密码长度做了判断，越多符合条件的项，密码的强度就越高。这个方法更加符合实际应用场景，比较推荐使用。

示例说明

示例1

假设一个用户注册页面，要求用户在设置密码时判断密码的强度。可以使用以下代码:

<input type="password" id="password" onkeyup="checkPassword()">
<div id="pwd-strength"></div>

function checkPassword() {
  var pwd = document.getElementById("password").value;
  var level = checkPwdLevel(pwd);
  var tips = "";
  if (level == 0) {
    tips = "密码不能为空";
  } else if (level == 1) {
    tips = "密码强度低";
  } else if (level == 2) {
    tips = "密码强度中";
  } else if (level >= 3) {
    tips = "密码强度高";
  }
  document.getElementById('pwd-strength').innerHTML = tips;
}

当用户在输入密码时，每次keyup即回调checkPassword函数进行密码判断，在页面标签中显示密码强度等级。这个方法简单易用，但是只能判断密码的强度等级。

示例2

假如一个用户表单中不仅有密码输入框，还有确认密码输入框。可以使用以下代码：

<input type="password" id="password" onkeyup="checkPassword()">
<input type="password" id="password-confirm" onkeyup="checkPwdConfirm()">
<div id="pwd-strength"></div>
<div id="pwd-confirm"></div>

function checkPassword() {
  var pwd = document.getElementById("password").value;
  var level = checkPwdLevel(pwd);
  var tips = "";
  if (level == 0) {
    tips = "密码不能为空";
  } else if (level == 1) {
    tips = "密码强度低";
  } else if (level == 2) {
    tips = "密码强度中";
  } else if (level >= 3) {
    tips = "密码强度高";
  }
  document.getElementById('pwd-strength').innerHTML = tips;
}

function checkPwdConfirm() {
  var pwd = document.getElementById("password").value;
  var confirm = document.getElementById("password-confirm").value;
  var tips = "";
  if (pwd == confirm) {
    tips = "密码输入正确";
  } else {
    tips = "两次密码输入不一致";
  }
  document.getElementById('pwd-confirm').innerHTML = tips;
}

当用户在输入密码和确认密码时，每次keyup即回调checkPassword和checkPwdConfirm函数进行密码判断，在页面标签中显示密码强度等级和密码输入状态。这个方法较为实用，可以有效避免重复输入错误的密码。