| 導購 | 订阅 | 在线投稿
分享
 
 
 

使用ASP.NET Atlas開發檢測密碼強度的自定義Behavior

來源:互聯網  2008-06-01 01:16:15  評論

作者:Dflying Chen (http://dflying.cnblogs.com/ )

本文源于維生素C.net的一篇文章利用數學方法來大大降低一個邏輯判斷實現的難度的例子。檢測代碼來自THIN的檢驗密碼強度的JS類。

Atlas中提供了客戶端javaScript強大的面向對象功能,這幾天看到了上述二位的帖子,覺得這個功能需求在日常開發中還是很常見的。晚上閑來無事,將上述功能封裝爲Atlas中的Behavior,以方便重用。關于Atlas的Behavior,請參考:在asp.net Atlas中創建自定義的Behavior。

按照在ASP.NET Atlas中創建自定義的Behavior這篇文章的五個自定義步驟,很容易寫出了這個Behavior。其中最重要的部分爲檢驗密碼強度的算法,這裏我偷了個懶,只是簡單的將THIN的代碼完全Copy過來(兄弟不要罵我-_-b),有心的朋友可以將它重構成更「Atlas」的樣子。這個檢測函數將在每次用戶在相應的input中按鍵時被觸發:

function keyPRessHandler() {

// you may refactor this part to make the code more 'Atlas like' :-)

var PassWordStrength ={

Level : ["高,實在是高","還行啦","靠,這樣也行"],

LevelValue : [30,20,0],//強度值

Factor : [1,2,5],//字符加數,分別爲字母,數字,其它

KindFactor : [0,0,10,20],//密碼含幾種組成的加數

Regex : [/[a-zA-Z]/g,/\d/g,/[^a-zA-Z0-9]/g] //字符正則數字正則其它正則

}

PasswordStrength.StrengthValue = function(pwd)

{

var strengthValue = 0;

var ComposedKind = 0;

for(var i = 0 ; i < this.Regex.length;i++)

{

var chars = pwd.match(this.Regex[i]);

if(chars != null)

{

strengthValue += chars.length * this.Factor[i];

ComposedKind ++;

}

}

strengthValue += this.KindFactor[ComposedKind];

return strengthValue;

}

PasswordStrength.StrengthLevel = function(pwd)

{

var value = this.StrengthValue(pwd);

for(var i = 0 ; i < this.LevelValue.length ; i ++)

{

if(value >= this.LevelValue[i] )

return this.Level[i];

}

}

// end of the refactoring section

$(_checkResultLabelID).innerHTML = PasswordStrength.StrengthLevel(this.control.element.value);

}

同時在這個Behavior中添加了屬性checkResultLabelID,用來指定顯示檢驗結果的Label:

var _checkResultLabelID;

this.get_checkResultLabelID = function() {

return _checkResultLabelID;

}

this.set_checkResultLabelID = function(value) {

if (_checkResultLabelID != value) {

_checkResultLabelID = value;

this.raisePropertyChanged('checkResultLabelID');

}

}

您也可以很方便的添加一些更花哨的功能,例如對于不同強度的輸入,提示文字的背景顔色有所改變等。完整的源代碼請參考本文後面的下載。

測試的步驟也很簡單,首先在ScriptManager中添加這個Behavior的引用:

<atlas:ScriptManager runat="server" ID="ScriptManager1">

<Scripts>

<atlas:ScriptReference Path="PasswordStrengthCheckBehavior.js" />

</Scripts>

</atlas:ScriptManager>

然後在頁面上添加一個input,用來輸入密碼(演示程序中沒有設定type爲password),和一個span,用來顯示檢驗結果:

<div>

Input a password:

<input id="password" type="text" />

<span id="result"></span>

</div>

最後,Atlas Script中將上面的input提升爲Atlas控件,並加入我們剛剛寫好的Behavior:

<script type="text/xml-script">

<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">

<components>

<textBox id="password">

<behaviors>

<passwordStrengthCheckBehavior checkResultLabelID="result" />

</behaviors>

</textBox>

</components>

</page>

</script>

就是這麽簡單,浏覽器中如下:

簡單密碼:

使用ASP.NET Atlas開發檢測密碼強度的自定義Behavior

中等密碼:

使用ASP.NET Atlas開發檢測密碼強度的自定義Behavior

複雜密碼:

使用ASP.NET Atlas開發檢測密碼強度的自定義Behavior

源代碼以及示例程序可以在此下載:http://www.cnblogs.com/Files/dflying/PasswordStrengthCheckBehaviorDemo.zip

作者:Dflying Chen (http://dflying.cnblogs.com/ ) 本文源于維生素C.net的一篇文章利用數學方法來大大降低一個邏輯判斷實現的難度的例子。檢測代碼來自THIN的檢驗密碼強度的JS類。 Atlas中提供了客戶端javaScript強大的面向對象功能,這幾天看到了上述二位的帖子,覺得這個功能需求在日常開發中還是很常見的。晚上閑來無事,將上述功能封裝爲Atlas中的Behavior,以方便重用。關于Atlas的Behavior,請參考:在asp.net Atlas中創建自定義的Behavior。 按照在ASP.NET Atlas中創建自定義的Behavior這篇文章的五個自定義步驟,很容易寫出了這個Behavior。其中最重要的部分爲檢驗密碼強度的算法,這裏我偷了個懶,只是簡單的將THIN的代碼完全Copy過來(兄弟不要罵我-_-b),有心的朋友可以將它重構成更「Atlas」的樣子。這個檢測函數將在每次用戶在相應的input中按鍵時被觸發: function keyPRessHandler() { // you may refactor this part to make the code more 'Atlas like' :-) var PassWordStrength ={ Level : ["高,實在是高","還行啦","靠,這樣也行"], LevelValue : [30,20,0],//強度值 Factor : [1,2,5],//字符加數,分別爲字母,數字,其它 KindFactor : [0,0,10,20],//密碼含幾種組成的加數 Regex : [/[a-zA-Z]/g,/\d/g,/[^a-zA-Z0-9]/g] //字符正則數字正則其它正則 } PasswordStrength.StrengthValue = function(pwd) { var strengthValue = 0; var ComposedKind = 0; for(var i = 0 ; i < this.Regex.length;i++) { var chars = pwd.match(this.Regex[i]); if(chars != null) { strengthValue += chars.length * this.Factor[i]; ComposedKind ++; } } strengthValue += this.KindFactor[ComposedKind]; return strengthValue; } PasswordStrength.StrengthLevel = function(pwd) { var value = this.StrengthValue(pwd); for(var i = 0 ; i < this.LevelValue.length ; i ++) { if(value >= this.LevelValue[i] ) return this.Level[i]; } } // end of the refactoring section $(_checkResultLabelID).innerHTML = PasswordStrength.StrengthLevel(this.control.element.value); } 同時在這個Behavior中添加了屬性checkResultLabelID,用來指定顯示檢驗結果的Label: var _checkResultLabelID; this.get_checkResultLabelID = function() { return _checkResultLabelID; } this.set_checkResultLabelID = function(value) { if (_checkResultLabelID != value) { _checkResultLabelID = value; this.raisePropertyChanged('checkResultLabelID'); } } 您也可以很方便的添加一些更花哨的功能,例如對于不同強度的輸入,提示文字的背景顔色有所改變等。完整的源代碼請參考本文後面的下載。 測試的步驟也很簡單,首先在ScriptManager中添加這個Behavior的引用: <atlas:ScriptManager runat="server" ID="ScriptManager1"> <Scripts> <atlas:ScriptReference Path="PasswordStrengthCheckBehavior.js" /> </Scripts> </atlas:ScriptManager> 然後在頁面上添加一個input,用來輸入密碼(演示程序中沒有設定type爲password),和一個span,用來顯示檢驗結果: <div> Input a password: <input id="password" type="text" /> <span id="result"></span> </div> 最後,Atlas Script中將上面的input提升爲Atlas控件,並加入我們剛剛寫好的Behavior: <script type="text/xml-script"> <page xmlns:script="http://schemas.microsoft.com/xml-script/2005"> <components> <textBox id="password"> <behaviors> <passwordStrengthCheckBehavior checkResultLabelID="result" /> </behaviors> </textBox> </components> </page> </script> 就是這麽簡單,浏覽器中如下: 簡單密碼: [url=/bbs/detail_1783447.html][img]http://image.wangchao.net.cn/it/1323622160107.JPG[/img][/url] 中等密碼: [url=/bbs/detail_1783447.html][img]http://image.wangchao.net.cn/it/1323622160308.JPG[/img][/url] 複雜密碼: [url=/bbs/detail_1783447.html][img]http://image.wangchao.net.cn/it/1323622160454.JPG[/img][/url] 源代碼以及示例程序可以在此下載:http://www.cnblogs.com/Files/dflying/PasswordStrengthCheckBehaviorDemo.zip
󰈣󰈤
王朝萬家燈火計劃
期待原創作者加盟
 
 
 
>>返回首頁<<
 
 
 
 
 熱帖排行
 
 
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有