בדוק את חוזק הסיסמה באמצעות JavaScript וביטויים רגולריים

בדוק את חוזק הסיסמה באמצעות JavaScript וביטויים רגולריים

ערכתי מחקר על מציאת דוגמה טובה לבודק חוזק סיסמה המשתמש JavaScript ו ביטויים רגילים (רגקס). ביישום בעבודתי אנו מבצעים פוסט בחזרה כדי לאמת את חוזק הסיסמה וזה די לא נוח עבור המשתמשים שלנו.

מה זה רגקס?

ביטוי רגולרי הוא רצף של תווים המגדירים דפוס חיפוש. בדרך כלל, דפוסים כאלה משמשים אלגוריתמים לחיפוש מחרוזות עבור למצוא or מצא והחלף פעולות על מיתרים, או לצורך אימות קלט. 

מאמר זה בהחלט לא אמור ללמד אתכם ביטויים קבועים. רק דע כי היכולת להשתמש בביטויים רגולריים תפשט לחלוטין את ההתפתחות שלך כשאתה מחפש תבניות בטקסט. חשוב לציין כי ברוב שפות הפיתוח אופטימיזציה של שימוש בביטוי קבוע ... אז במקום לנתח ולחפש מחרוזות שלב אחר שלב, Regex בדרך כלל מהירה הרבה יותר הן בשרת והן בצד הלקוח.

חיפשתי באינטרנט לא מעט לפני שמצאתי דוגמה של כמה ביטויים נהדרים המחפשים שילוב של אורך, תווים וסמלים. עם זאת, הקוד היה מוגזם לטעמי והותאם ל- .NET. אז פשטתי את הקוד ושמתי אותו ב- JavaScript. זה גורם לו לאמת את חוזק הסיסמה בזמן אמת בדפדפן הלקוח לפני פרסום זה בחזרה ... ומספק משוב למשתמש על חוזק הסיסמה.

הקלד סיסמא

בכל פעימה במקלדת, הסיסמה נבדקת על פי הביטוי הרגולרי ואז ניתן משוב למשתמש בטווח מתחתיו.




הקש ססמא

הנה הקוד

ביטויים רגילים לעשות עבודה נהדרת של מזעור אורך הקוד:

  • עוד דמויות - אם האורך נמוך מ- 8 תווים.
  • חלש - אם האורך קטן מ -10 תווים ואינו מכיל שילוב של סמלים, אותיות, טקסט.
  • בינוני - אם האורך הוא 10 תווים ומעלה ויש לו שילוב של סמלים, אותיות, טקסט.
  • חזק - אם האורך הוא 14 תווים ומעלה ויש לו שילוב של סמלים, אותיות, טקסט.

<script language="javascript">
    function passwordChanged() {
        var strength = document.getElementById('strength');
        var strongRegex = new RegExp("^(?=.{14,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
        var mediumRegex = new RegExp("^(?=.{10,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
        var enoughRegex = new RegExp("(?=.{8,}).*", "g");
        var pwd = document.getElementById("password");
        if (pwd.value.length == 0) {
            strength.innerHTML = 'Type Password';
        } else if (false == enoughRegex.test(pwd.value)) {
            strength.innerHTML = 'More Characters';
        } else if (strongRegex.test(pwd.value)) {
            strength.innerHTML = '<span style="color:green">Strong!</span>';
        } else if (mediumRegex.test(pwd.value)) {
            strength.innerHTML = '<span style="color:orange">Medium!</span>';
        } else {
            strength.innerHTML = '<span style="color:red">Weak!</span>';
        }
    }
</script>
<input name="password" id="password" type="text" size="15" maxlength="100" onkeyup="return passwordChanged();" />
<span id="strength">Type Password</span>

הקשחת בקשת הסיסמה שלך

זה חיוני שלא לאמת רק את בניית הסיסמה בתוך ה- Javascript שלך. זה יאפשר לכל מי שיש לו כלים לפיתוח דפדפן לעקוף את הסקריפט ולהשתמש בכל הסיסמה שהם רוצים. עליך להשתמש תמיד בבדיקה בצד השרת כדי לאמת את חוזק הסיסמה לפני שתשמור אותה בפלטפורמה שלך.