Gaan wagwoordsterkte na met JavaScript en gewone uitdrukkings

Gaan wagwoordsterkte na met JavaScript en gewone uitdrukkings

Ek het navorsing gedoen oor die vind van 'n goeie voorbeeld van 'n wagwoordsterktekontroleerder wat gebruik word JavaScript en Gereelde uitdrukkings (Regex). In die aansoek by my werk doen ons 'n terugvoer om die sterkte van die wagwoord te verifieer en dit is nogal ongerieflik vir ons gebruikers.

Wat is Regex?

'N Gereelde uitdrukking is 'n reeks karakters wat 'n soekpatroon definieer. Gewoonlik word sulke patrone gebruik deur algoritmes vir snaar soek vind or vind en vervang bewerkings op toutjies, of vir invoer validering. 

Hierdie artikel moet u beslis nie gereelde uitdrukkings leer nie. Weet net dat die gebruik van Regular Expressions u ontwikkeling absoluut sal vergemaklik as u patrone in teks soek. Dit is ook belangrik om op te let dat die meeste ontwikkelingstale die gebruik van gereelde uitdrukkings geoptimaliseer het ... dus eerder as om snare stapsgewys te ontleed en te soek, is Regex gewoonlik baie vinniger op die bediener en op die kliënt.

Ek het nogal 'n bietjie op die web gesoek voordat ek dit gekry het n voorbeeld van 'n paar uitstekende Regular Expressions wat 'n kombinasie van lengte, karakters en simbole soek. Die kode was egter na my smaak 'n bietjie buitensporig en aangepas vir .NET. Daarom het ek die kode vereenvoudig en dit in JavaScript geplaas. Dit laat dit die wagwoordsterkte intyds in die blaaier van die kliënt bekragtig voordat dit teruggestuur word ... en gee terugvoer aan die gebruiker oor die sterkte van die wagwoord.

Tik 'n wagwoord

Met elke toetssleutel word die wagwoord aan die normale uitdrukking getoets en dan word die gebruiker terugvoer gegee in 'n omvang daaronder.




Tik wagwoord

Hier is die kode

Die Gereelde uitdrukkings doen 'n fantastiese werk om die lengte van die kode te verminder:

  • Meer karakters - As die lengte minder as 8 karakters is.
  • Swak - As die lengte minder as tien karakters is en nie 'n kombinasie van simbole, hoofletters, teks bevat nie.
  • Medium - As die lengte 10 karakters of meer bevat en 'n kombinasie van simbole, hoofletters, teks bevat.
  • Sterk - As die lengte 14 karakters of meer bevat en 'n kombinasie van simbole, hoofletters, teks bevat.

<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>

Verhard u wagwoordversoek

Dit is noodsaaklik dat u nie net die wagwoordkonstruksie in u Javascript bekragtig nie. Dit sal almal met blaaierontwikkelingsinstrumente in staat stel om die script te omseil en die wagwoord te gebruik wat hulle wil hê. U moet ALTYD 'n tjek aan die bedienerkant gebruik om die sterkte van die wagwoord te bekragtig voordat u dit op u platform bêre.