Auteur : Dflying Chen ( http://dflying.cnblogs.com/ )
Cet article est dérivé d'un article sur Vitamin C.net qui utilise des méthodes mathématiques pour réduire considérablement la difficulté de mise en œuvre d'un jugement logique. Le code de détection provient de la classe JS de THIN pour vérifier la force du mot de passe.
Atlas fournit de puissantes fonctions orientées objet de JavaScript côté client. J'ai vu les articles des deux ci-dessus ces derniers jours et j'estime que cette exigence fonctionnelle est encore très courante dans le développement quotidien. Je n'ai rien à faire la nuit, j'encapsule donc les fonctions ci-dessus dans Behaviors in Atlas pour une réutilisation facile. Pour plus d'informations sur le comportement d'Atlas, veuillez vous référer à : Création d'un comportement personnalisé dans ASP.NET Atlas.
En suivant les cinq étapes de personnalisation de cet article sur la création d'un comportement personnalisé dans ASP.NET Atlas, il est facile d'écrire ce comportement. La partie la plus importante est l'algorithme pour tester la force du mot de passe. J'ai été paresseux ici et j'ai simplement copié complètement le code THIN (frère, ne me grondez pas -_-b). Les amis intéressés peuvent le reconstruire en quelque chose de plus "Atlas". . Cette fonction de détection sera déclenchée à chaque fois que l'utilisateur appuie sur une touche dans l'entrée correspondante :
function keyPressHandler() {
// vous pouvez refactoriser cette partie pour rendre le code plus 'Atlas like' :-)
varMot de passeStrength ={
Niveau : ["Élevé, c'est vraiment élevé", "C'est bon", "Merde, c'est bon"],
LevelValue : [30,20,0],//Valeur de force
Facteur : [1,2,5],//Ajouts de caractères, respectivement lettres, chiffres, autres
KindFactor : [0,0,10,20],//Le mot de passe contient plusieurs types d'ajouts
Regex : [/[a-zA-Z]/g,/d/g,/[^a-zA-Z0-9]/g] //Nombres réguliers de caractères et autres règles régulières
}
Mot de passeStrength.StrengthValue = fonction (mot de passe)
{
var forceValue = 0 ;
var ComposedKind = 0;
pour (var i = 0; i < this.Regex.length;i++)
{
var chars = pwd.match(this.Regex[i]);
si(caractères != null)
{
StrengthValue += chars.length * this.Factor[i];
ComposéKind++ ;
}
}
forceValue += this.KindFactor[ComposedKind];
renvoyer la valeur de force ;
}
Mot de passeStrength.StrengthLevel = fonction (mot de passe)
{
var valeur = this.StrengthValue(pwd);
pour (var i = 0; i < this.LevelValue.length; i++)
{
if(value >= this.LevelValue[i] )
renvoie this.Level[i];
}
}
// fin de la section refactoring
$(_checkResultLabelID).innerHTML = Mot de passeStrength.StrengthLevel(this.control.element.value);
}
Parallèlement, l'attribut checkResultLabelID est ajouté à ce Behavior pour spécifier le Label d'affichage des résultats du test :
var _checkResultLabelID;
this.get_checkResultLabelID = fonction() {
retourner _checkResultLabelID ;
}
this.set_checkResultLabelID = fonction (valeur) {
if (_checkResultLabelID != valeur) {
_checkResultLabelID = valeur ;
this.raisePropertyChanged('checkResultLabelID');
}
}
Vous pouvez également facilement ajouter des fonctions plus sophistiquées, telles que la modification de la couleur d'arrière-plan du texte d'invite pour des entrées de différentes forces, etc. Pour le code source complet, veuillez vous référer au téléchargement à la fin de cet article.
Les étapes de test sont également très simples. Tout d’abord, ajoutez une référence à ce comportement dans ScriptManager :
<atlas:ScriptManager runat="server" ID="ScriptManager1">.
<Scripts>
<atlas:ScriptReference Path="PasswordStrengthCheckBehavior.js" />
</Scripts>
</atlas:ScriptManager>
Ajoutez ensuite une entrée à la page pour saisir le mot de passe (le type n'est pas défini sur mot de passe dans le programme de démonstration) et un span pour afficher les résultats du test :
<div>
Entrez un mot de passe :
<input id="password" type="text" />
<span id="result"></span>
</div>
Enfin, Atlas Script promeut l'entrée ci-dessus dans un contrôle Atlas et ajoute le comportement que nous venons d'écrire :
<script type="text/xml-script">
<page xmlns:script=" http://schemas.microsoft.com/xml-script/2005 ">
<composants>
<textBox id="mot de passe">
<comportements>
<passwordStrengthCheckBehavior checkResultLabelID="result" />
</comportements>
</textBox>
</composants>
</page>
</script>
C'est aussi simple que cela, comme suit dans le navigateur :
Mot de passe simple :
Mot de passe moyen :
Mot de passe complexe :
Le code source et des exemples de programmes peuvent être téléchargés ici :