分享
 
 
 

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

王朝asp·作者佚名  2008-06-01
窄屏简体版  字體: |||超大  

作者: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>

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

簡單密碼:

中等密碼:

復雜密碼:

源代碼以及示例程序可以在此下載: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> 就是這麽簡單,瀏覽器中如下: 簡單密碼: [img]http://image.wangchao.net.cn/it/1323622160107.JPG[/img] 中等密碼: [img]http://image.wangchao.net.cn/it/1323622160308.JPG[/img] 復雜密碼: [img]http://image.wangchao.net.cn/it/1323622160454.JPG[/img] 源代碼以及示例程序可以在此下載:http://www.cnblogs.com/Files/dflying/PasswordStrengthCheckBehaviorDemo.zip
2023年上半年GDP全球前十五強
 百态   2023-10-24
美眾議院議長啟動對拜登的彈劾調查
 百态   2023-09-13
上海、濟南、武漢等多地出現不明墜落物
 探索   2023-09-06
印度或要將國名改為「巴拉特」
 百态   2023-09-06
男子為女友送行,買票不登機被捕
 百态   2023-08-20
手機地震預警功能怎麽開?
 干货   2023-08-06
女子4年賣2套房花700多萬做美容:不但沒變美臉,面部還出現變形
 百态   2023-08-04
住戶一樓被水淹 還衝來8頭豬
 百态   2023-07-31
女子體內爬出大量瓜子狀活蟲
 百态   2023-07-25
地球連續35年收到神秘規律性信號,網友:不要回答!
 探索   2023-07-21
全球鎵價格本周大漲27%
 探索   2023-07-09
錢都流向了那些不缺錢的人,苦都留給了能吃苦的人
 探索   2023-07-02
倩女手遊刀客魅者強控制(強混亂強眩暈強睡眠)和對應控制抗性的關系
 百态   2020-08-20
美國5月9日最新疫情:美國確診人數突破131萬
 百态   2020-05-09
荷蘭政府宣布將集體辭職
 干货   2020-04-30
倩女幽魂手遊師徒任務情義春秋猜成語答案逍遙觀:鵬程萬裏
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案神機營:射石飲羽
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案昆侖山:拔刀相助
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案天工閣:鬼斧神工
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案絲路古道:單槍匹馬
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案鎮郊荒野:與虎謀皮
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案鎮郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案鎮郊荒野:指鹿為馬
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案金陵:小鳥依人
 干货   2019-11-12
倩女幽魂手遊師徒任務情義春秋猜成語答案金陵:千金買鄰
 干货   2019-11-12
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有