密码强度检测

最新推荐文章于 2024-06-01 09:53:58 发布
最新推荐文章于 2024-06-01 09:53:58 发布
阅读量447 收藏
点赞数
分类专栏： js 文章标签： JavaScript CSS HTML BBS Blog ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/haige807/article/details/83738050
版权

密码强度提示是最近流行的一个功能，但是99%的案例都忽略了检测机制。

基本上都是把字符分成四类：数字、小写英文、大写英文、符号，然后按照组合复杂度来直接判断强弱程度：

单一，是弱密码。
两两组合，是中密码。
超过两种组合，是强密码。

方案一

<SCRIPT language=javascript>     
   
    //CharMode函数     
    //测试某个字符是属于哪一类.     
    function CharMode(iN)    
    {     
        if (iN>=48 && iN <=57) //数字     
        return 1;     
        if (iN>=65 && iN <=90) //大写字母     
        return 2;     
        if (iN>=97 && iN <=122) //小写     
        return 4;     
        else     
        return 8; //特殊字符     
    }     
        
    //bitTotal函数     
    //计算出当前密码当中一共有多少种模式     
    function bitTotal(num)    
    {     
        modes=0;     
        for (i=0;i<4;i++)    
        {     
            if (num & 1) modes++;     
            num>>=1;     
        }     
        return modes;     
    }     
        
    //checkStrong函数     
    //返回密码的强度级别     
        
    function checkStrong(sPW)    
    {     
        if (sPW.length<=4)     
        return 0; //密码太短     
        Modes=0;     
        for (i=0;i<sPW.length;i++)    
        {     
            //测试每一个字符的类别并统计一共有多少种模式.     
            Modes|=CharMode(sPW.charCodeAt(i));     
        }     
        return bitTotal(Modes);     
    }     
        
    //pwStrength函数     
    //当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色     
        
    function pwStrength(pwd)    
    {     
        O_color="#eeeeee";     
        L_color="#FF0000";     
        M_color="#FF9900";     
        H_color="#33CC00";     
        if (pwd==null||pwd=="")    
        {     
            Lcolor=Mcolor=Hcolor=O_color;     
        }     
        else   
        {     
            S_level=checkStrong(pwd);     
            switch(S_level)    
            {     
                case 0:     
                Lcolor=Mcolor=Hcolor=O_color;     
                case 1:     
                Lcolor=L_color;     
                Mcolor=Hcolor=O_color;     
                break;     
                case 2:     
                Lcolor=Mcolor=M_color;     
                Hcolor=O_color;     
                break;     
                default:     
                Lcolor=Mcolor=Hcolor=H_color;     
            }     
        }     
        document.getElementById("strength_L").style.background=Lcolor;     
        document.getElementById("strength_M").style.background=Mcolor;     
        document.getElementById("strength_H").style.background=Hcolor;     
        return;     
    }     
   
</SCRIPT>     
   
    <FORM name="form1" action=""><P>     
    输入密码:</P><P>    
    <INPUT οnblur=pwStrength(this.value) οnkeyup=pwStrength(this.value) type=password size=10 value="">     
    <BR>    密码强度: </P><P>    
    <TABLE style="DISPLAY: inline" borderColor=#cccccc height=23 cellSpacing=0 cellPadding=1 width=217 border=1>
	<TBODY>
	<TR align=middle bgColor=#eeeeee>
	<TD id=strength_L width="33%">弱</TD>
	<TD id=strength_M width="33%">中</TD>
	<TD id=strength_H width="33%">强</TD>
	</TR>
	</TBODY>
	</TABLE>     
    </P><P> </P><P> </P></FORM>    
<PRE></PRE>

 

方案二

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>密码</title>
<script type="text/javascript">
	function chkpwd(obj){
		var t=obj.value;
		var id=getResult(t);
		
		//定义对应的消息提示
		var msg=new Array(4);
		msg[0]="密码过短";
		msg[1]="密码强度差";
		msg[2]="密码强度良好";
		msg[3]="密码强度高";
		
		var sty=new Array(4);
		sty[0]=-45;
		sty[1]=-30;
		sty[2]=-15;
		sty[3]=0;
		
		var col=new Array(4);
		col[0]="gray";
		col[1]="red";
		col[2]="#ff6600";
		col[3]="Green";
		
		//设置显示效果
		var bImg="http://bbs.blueidea.com/attachments/2006/12/7/pwdlen_dSIPeEGQWxfO.gif";//一张显示用的图片
		var sWidth=300;
		var sHeight=15;
		var Bobj=document.getElementById("chkResult");

		Bobj.style.fontSize="12px";
		Bobj.style.color=col[id];
		Bobj.style.width=sWidth + "px";
		Bobj.style.height=sHeight + "px";
		Bobj.style.lineHeight=sHeight + "px";
		Bobj.style.background="url(" + bImg + ") no-repeat left " + sty[id] + "px";
		Bobj.style.textIndent="20px";
		Bobj.innerHTML="检测提示：" + msg[id];
	}
	
	//定义检测函数,返回0/1/2/3分别代表无效/差/一般/强
	function getResult(s){
		if(s.length < 4){
			return 0;
		}
		var ls = 0;
		if (s.match(/[a-z]/ig)){
			ls++;
		}
		if (s.match(/[0-9]/ig)){
			ls++;
		}
	 	if (s.match(/(.[^a-z0-9])/ig)){
			ls++;
		}
		if (s.length < 6 && ls > 0){
			ls--;
		}
		return ls
	}
</script>
<style type="text/css">
body{
	font-size:12px;
	font-family: Arial, Helvetica, sans-serif;
	margin:0;
}
form{
	margin:2em;
}
#chkResult{margin-left:53px;height:15px;}
</style>

</head>

<body>
<form name="form1">
	<label for="pwd">用户密码</label>
	<input type="password" name="pwd" οnblur="chkpwd(this)" />
	<div id="chkResult"></div>
	<label for="pwd2">重复密码</label>
	<input type="password" name="pwd2" />
</form>

</body>

</html>

 方案三 

<html>
	<body>
		<form id="myform">
			<h1>Password Strength Meter - Demo</h1> 
			<script type="text/javascript" s>
// Password strength meter v1.0
// Matthew R. Miller - 2007
// www.codeandcoffee.com
// Based off of code from  http://www.intelligent-web.co.uk

// Settings
// -- Toggle to true or false, if you want to change what is checked in the password
var bCheckNumbers = true;
var bCheckUpperCase = true;
var bCheckLowerCase = true;
var bCheckPunctuation = true;
var nPasswordLifetime = 365;

// Check password
function checkPassword(strPassword)
{
	// Reset combination count
	nCombinations = 0;
	
	// Check numbers
	if (bCheckNumbers)
	{
		strCheck = "0123456789";
		if (doesContain(strPassword, strCheck) > 0) 
		{ 
        		nCombinations += strCheck.length; 
    		}
	}
	
	// Check upper case
	if (bCheckUpperCase)
	{
		strCheck = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
		if (doesContain(strPassword, strCheck) > 0) 
		{ 
        		nCombinations += strCheck.length; 
    		}
	}
	
	// Check lower case
	if (bCheckLowerCase)
	{
		strCheck = "abcdefghijklmnopqrstuvwxyz";
		if (doesContain(strPassword, strCheck) > 0) 
		{ 
        		nCombinations += strCheck.length; 
    		}
	}
	
	// Check punctuation
	if (bCheckPunctuation)
	{
		strCheck = ";:-_=+\|//?^&!.@$?*()%~<>{}[]";
		if (doesContain(strPassword, strCheck) > 0) 
		{ 
        		nCombinations += strCheck.length; 
    		}
	}
	
	// Calculate
	// -- 500 tries per second => minutes 
    	var nDays = ((Math.pow(nCombinations, strPassword.length) / 500) / 2) / 86400;
 
	// Number of days out of password lifetime setting
	var nPerc = nDays / nPasswordLifetime;
	
	return nPerc;
}
 
// Runs password through check and then updates GUI 
function runPassword(strPassword, strFieldID) 
{
	// Check password
	nPerc = checkPassword(strPassword);
	
	 // Get controls
    	var ctlBar = document.getElementById(strFieldID + "_bar"); 
    	var ctlText = document.getElementById(strFieldID + "_text");
    	if (!ctlBar || !ctlText)
    		return;
    	
    	// Set new width
    	var nRound = Math.round(nPerc * 100);
	if (nRound < (strPassword.length * 5)) 
	{ 
		nRound += strPassword.length * 5; 
	}
	if (nRound > 100)
		nRound = 100;
    	ctlBar.style.width = nRound + "%";
 
 	// Color and text
 	if (nRound > 95)
 	{
 		strText = "极佳";
 		strColor = "#3bce08";
 	}
 	else if (nRound > 75)
 	{
 		strText = "很好";
 		strColor = "orange";
	}
 	else if (nRound > 50)
 	{
 		strText = "一般";
 		strColor = "#ffd801";
 	}
 	else
 	{
 		strColor = "red";
 		strText = "极差";
 	}
	ctlBar.style.backgroundColor = strColor;
	ctlText.innerHTML = "<span style='color: " + strColor + ";'>" + strText + "</span>";
}
 
// Checks a string for a list of characters
function doesContain(strPassword, strCheck)
 {
    	nCount = 0; 
 
	for (i = 0; i < strPassword.length; i++) 
	{
		if (strCheck.indexOf(strPassword.charAt(i)) > -1) 
		{ 
	        	nCount++; 
		} 
	} 
 
	return nCount; 
}



</script> 

			<b>Password:</b>
			<br /> 
			<input type="password" id="mypassword" name="mypassword" οnkeyup="runPassword(this.value, 'mypassword');" />
			<br />
			<br />
			<b>Password Strength:</b>
			<br /> 
			<div style="width: 100px;"> 
				<div id="mypassword_text" style="font-size: 10px;"></div>
				<div id="mypassword_bar" style="font-size: 1px; height: 2px; width: 0px; border: 1px solid white;"></div> 
			</div>
		</form>
	</body>
</html>

 方案四 

<html>
<title>密码强度计算-www.codefans.net</title>
<head>
<style type="text/css">
<!--
.text {
	height: 16px;
	width: 160px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #F0F0F0;
	border-bottom-color: #F0F0F0;
	border-left-color: #999999;
}
.style1 {font-size: 12px}
.m {
	background-image: url(image/m.gif);
	background-repeat: no-repeat;
	height: 15px;
	width: 158px;
}
.r {
	background-image: url(image/r.gif);
	background-repeat: no-repeat;
	height: 15px;
	width: 158px;
}
.z {
	background-image: url(image/z.gif);
	background-repeat: no-repeat;
	height: 15px;
	width: 158px;
}
.q {
	background-image: url(image/q.gif);
	background-repeat: no-repeat;
	height: 15px;
	width: 158px;
}
.style5 {font-size: 12px; color: #FF0000; }
.style6 {font-size: 12px; color: #F1F1F1; }
.style7 {font-size: 12px; color: #F1F1F1; }
.style8 {font-size: 12px; color: green; }
.style9 {font-size: 12px; color: red; }
-->
</style>
</head>
<script language=javascript>
function CharMode(iN){
	if (iN>=48 && iN <=57) //数字
		return 1; 
	if (iN>=65 && iN <=90) //大写字母
		return 2;
	if (iN>=97 && iN <=122) //小写
		return 4;
	else
		return 8; //特殊字符
}
function bitTotal(num){
	modes=0;
	for (i=0;i<5;i++){
		if (num & 1) modes++;
		num>>>=1;
	}
	return modes;
}
function checkStrong(sPW){
	if (sPW.length<=5)
		return 0;  //密码太短
	Modes=0;
	for (i=0;i<sPW.length;i++){
		Modes|=CharMode(sPW.charCodeAt(i));
	}
	return bitTotal(Modes);	
}	
function pwStrength(pwd,vImg,vImgs,ilength){
	   if(pwd.length<=0){
	   		document.getElementById(vImgs).innerHTML="<span style=color:red;font-size:12px>"+16+"</span>";
	   }
	   else{ 
	   		document.getElementById(vImgs).innerHTML="<span style=color:red;font-size:12px>"+(16-pwd.length)+"</span>";
	   }
	if (pwd==null||pwd==''){
		document.getElementById(vImg).className="m";
		//document.getElementById(ilength).className="style6";
	}	
	else{
		S_level=checkStrong(pwd);
		switch(S_level){
			case 0:
				document.getElementById(vImg).className="m";
				//document.getElementById(ilength).className="style6";
				break;
			case 1:
				document.getElementById(vImg).className="r";
				//document.getElementById(ilength).className="style7";
				break;
			case 2:
				document.getElementById(vImg).className="z";
				//document.getElementById(ilength).className="style8";
				break;
			default:
				document.getElementById(vImg).className="q";
				//document.getElementById(ilength).className="style9";
		}
	}
	return;
}
</script>
<body>
<div align="center">
  <p>    <br>
  </p>
  <form name="form1" method="post" action="">
    <table width="240" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="69" height="24">
        <div align="right" class="style1">密&nbsp;&nbsp;&nbsp; 码：</div></td>
        <td width="171"><div align="center">
          <input name="str1" type="password" class="text" onKeyUp="pwStrength(this.value,'img','imgs','ilength')" value="" maxlength="16" >
        </div></td>
      </tr>
      <tr>
        <td height="24">
        <div align="right" class="style1">密码强度：</div></td>
        <td height="19"><div align="center">
          <table width="160" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td align="center" valign="middle" class="m" id="img">
                    <table width="90%"  border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td width="46%"><div align="right" class="style6" id="ilength"></div></td>
                        <td width="14%">&nbsp;</td>
                        <td width="40%" id="imgs"><span class="style5">16</span></td>
                      </tr>
                </table></td>
              </tr>
          </table>
        </div></td>
      </tr>
    </table>
  </form>
</div>
</body>
</html>

 

来自：http://lqw.iteye.com/blog/337770 

haige807
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
php密码强度检测函数
u013553807的博客
10-15 479
密码强度检测
密码强度检测器
m0_57158496的博客
12-06 4858
   python“每日一练” 题目 代码运行效果 完整代码 我的博文推荐 练习题目    定义一个名为“isStrongPassword”的函数，该函数将字符串作为参数，功能是将检查所提供的字符串是否满足以下条件，以检查是否为强密码：   该函数将返回一个布尔值，即如果满足所有条件将返回True，否则返回False。确保使用可能返回False值的每个可能的输入来测试函数也一样。 回首页 代码运行效果 回首页 python完整代码 #/sur/bin/nve python .
推荐开源项目：密码强度检测库——PasswordStrength
最新发布
gitblog_00039的博客
06-01 332
推荐开源项目：密码强度检测库——PasswordStrength 项目地址:https://gitcode.com/fnando/password_strength 项目简介 PasswordStrength 是一个高效的密码强度验证工具，它通过多种规则对用户的密码进行评估，以确保其安全性。该库支持Ruby的ActiveRecord和ActiveModel，并提供了JavaScript版本，可在前...
python密码强度检测程序_用100行代码写个密码强度检测器
weixin_29587591的博客
01-29 898
很多网站在用户注册账号的时候为了保证账户的安全，都会自动检测用户密码的强度并给出提醒让用户设置一个相对安全的密码，你是不是很好奇这个密码强度检测是怎么开发的，原理又是怎样的，来吧，这个项目就教大家如何使用python实现一个简单的检测密码强度的库，只需要不到100行的代码即可实现，非常简单。效果图效果图从效果图可以看出，该检测器可以检测不同的密码强度并给出提示信息。评测规则说到密码强度，不用想也知...
c语言密码强度检测代码,密码强度检测效果实现原理与代码
weixin_33622555的博客
05-24 543
密码强度检测效果function chkpwd(obj){var t=obj.value;var id=getResult(t);//定义对应的消息提示var msg=new Array(4);msg[0]="密码过短。";msg[1]="密码强度差。";msg[2]="密码强度良好。";msg[3]="密码强度高。";var sty=new Array(4);sty[0]=-45;sty[1]=...
python实现密码强度检测器_Python实现的密码强度检测器示例
weixin_39863371的博客
12-10 928
本文实例讲述了Python实现的密码强度检测器。分享给大家供大家参考，具体如下：密码强度密码强度如何量化呢？一个密码可以有以下几种类型：长度、大写字母、小写字母、数字以及特殊符号。显然，密码包含的特征越多、长度越长，其强度也就越高。我们设置几个等级来评测密码强度，分别是：terrible, simple,medium, strong。不同的应用可能对密码强度的要求不一样，我们引入最小程度(min_...
php 检测密码,php 密码强度检测代码
weixin_31516001的博客
03-09 241
本文介绍下，用php实现的用于检测密码强度的一段代码，有需要的朋友参考下。在php编程中，尤其是用户注册这样的模块时，对用户密码强度的要求，再多也不过。现在很多网站，都会对密码强度进行检测，以获取符合安全要求的用户密码。不过，有些对密码强度检测的功能，是建立在js或其它脚本上的，这可能会被恶意破坏者越过密码检测，而进行破坏。本文介绍的这段代码，基于对长度、特殊字符、数字、字母等进行检测，另外，还可...
php 密码强度 类,一个用php实现密码强度检测的类
weixin_42250191的博客
03-26 529
首先，定义出密码强度的分类：弱密码：长度至少为6个字符中等强度密码：长度至少为6个字符不能包含用户的帐户名包含密码字符集(数字，小写字母，大写字母，特殊字符)3类字符高等强度密码：长度至少为7个字符包含密码字符集中4类字符为了让密码检测更具有可扩展性，决定按一下方式构建类：pass_rule.php密码强度规则文件，修改此文件就可以实现不同的密码强度检测方式define("UNVALID", 0)...
jquery表单密码强度检测实现（）
zgphacker2010的专栏
12-18 1437
最近打算在用户改密表单 或 创建账号表单中，对输入的密码进行强度检测功能。在网上找了两篇比较实用的资源，本人对这些资源进行了整合。下面给出了几种效果图： 效果1：jquery.validate表单验证密码完整例子(带密码强度显示） 说明，这里的强中弱三种效果是使用背景图片实现的 效果2：jquery注册表单设置密码强度提示判断验证代码 说明，这个案例中是使用纯CSS效果实现 效果...
WZOI-309密码强度检测
善良的小乔的博客
12-24 459
WZOI-309密码强度检测
java实现的密码强度检测功能完整示例
08-25
java实现的密码强度检测功能完整示例主要介绍了java实现的密码强度检测功能，结合完整实例形式分析了java针对密码强度检测相关的字符串遍历、判断，以及输出密码强度等级相关操作技巧。 密码强度检测是指对密码的...
C语言实现密码强度检测
08-19
C语言实现密码强度检测 密码强度检测是计算机安全中的一项重要任务，C语言作为编程语言之一，广泛应用于密码强度检测中。密码强度检测的目的是为了评估密码的安全性和强度，以便更好地保护用户的隐私和财产。 密码...
密码强度检测效果实现原理与代码
09-05
首先，我们来看一下密码强度检测的基本原理。通常，密码强度的评估基于以下几个标准： 1. **长度**：密码长度是决定其强度的关键因素，通常建议密码至少包含8个字符，但更长的密码通常更安全。 2. **复杂性**：...
passwordStrength的密码强度检测特效代码
03-20
网页 密码框 小键盘效果
middlesea18
10-27 791
为了增加输入信息的安全性，有些时候我们在输入密码等信息时，需要启动小键盘输入，下面介绍一种在网页中添加小键盘输入的方法。 一个实现小键盘效果的JS文件keypad.js: //定义当前是否大写的状态var CapsLockValue=0; var check;function setVariables() {tablewidth=630; // logo width, in pixelsta...
页面加载后自动刷新一次的方法
middlesea18
10-27 563
只要在页面的开头加上这么一段代码就OK了。嘿嘿 &lt;SCRIPT   LANGUAGE="JavaScript"&gt;       function   fresh()  {  if(location.href.indexOf("?reload=true")&lt;0)   {    location.href+="?reload=true";     }  }  setTime...
jquery密码强度检测
04-02
以下是一个基本的jQuery密码强度检测代码： ```javascript $(document).ready(function(){ $('#password').keyup(function(){ var password = $(this).val(); var strength = 0; if (password.match(/[a-z]+/)) { strength += 1; } if (password.match(/[A-Z]+/)) { strength += 1; } if (password.match(/[0-9]+/)) { strength += 1; } if (password.match(/[$@#&!]+/)) { strength += 1; } if (password.length >= 8) { strength += 1; } switch(strength) { case 0: $('#password-strength').html("密码强度：太弱了").css('color', 'red'); break; case 1: $('#password-strength').html("密码强度：弱").css('color', 'orange'); break; case 2: $('#password-strength').html("密码强度：一般").css('color', 'yellow'); break; case 3: $('#password-strength').html("密码强度：强").css('color', 'green'); break; case 4: $('#password-strength').html("密码强度：很强").css('color', 'darkgreen'); break; default: $('#password-strength').html(""); } }); }); ``` 在这个代码中，我们使用了jQuery的`keyup()`方法来检测密码输入框的内容是否发生了变化。然后我们获取密码的值，并使用正则表达式来检查密码是否包含小写字母、大写字母、数字和特殊字符以及密码的长度是否大于等于8个字符。每个条件都会增加密码的强度值。最后，我们使用`switch()`语句根据不同的强度值来显示不同的提示信息，并根据强度值来设置不同的颜色。 你可以根据自己的需求来自定义密码强度检测的条件和提示信息。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值