Preverite moč gesla z JavaScriptom in regularnimi izrazi

Preverite moč gesla z JavaScriptom in regularnimi izrazi

Delal sem nekaj raziskav, kako najti dober primer programa za preverjanje moči gesla, ki uporablja JavaScript in Redni izrazi (Regex). V aplikaciji pri mojem delu objavimo nazaj, da preverimo trdnost gesla in je za naše uporabnike precej neprijetno.

Kaj je zdravilo Regex?

Regularni izraz je zaporedje znakov, ki definirajo iskalni vzorec. Običajno take vzorce uporabljajo algoritmi za iskanje nizov za iskanje or najti in zamenjati operacije na nizih ali za preverjanje vnosa. 

Ta članek zagotovo ni namenjen učenju regularnih izrazov. Samo vedite, da vam bo uporaba regularnih izrazov poenostavila razvoj, ko boste iskali vzorce v besedilu. Pomembno je tudi opozoriti, da ima večina razvojnih jezikov optimizirano uporabo regularnih izrazov ... zato je Regex, namesto da razčlenjuje in išče nize po korakih, običajno veliko hitrejši tako na strežniku kot na strani odjemalca.

Precej sem iskal po spletu, preden sem našel primer nekaterih odličnih regularnih izrazov, ki iščejo kombinacijo dolžine, znakov in simbolov. Kakorkoli že, koda je bila za moj okus nekoliko pretirana in prilagojena .NET-u. Zato sem poenostavil kodo in jo postavil v JavaScript. Zaradi tega sproti preveri moč gesla v odjemalčevem brskalniku, preden ga objavi nazaj ... in uporabniku zagotovi nekaj povratnih informacij o moči gesla.

Vnesite geslo

Z vsakim potezom tipkovnice se geslo preizkusi glede na regularni izraz, nato pa se uporabniku v razponu pod njim posredujejo povratne informacije.




Vnesite geslo

Tu je koda

O Redni izrazi naredite fantastično delo, da zmanjšate dolžino kode:

  • Več znakov - Če je dolžina manjša od 8 znakov.
  • Šibko - Če je dolžina manjša od 10 znakov in ne vsebuje kombinacije simbolov, velikih črk in besedila.
  • srednje - Če je dolžina 10 znakov ali več in ima kombinacijo simbolov, velikih črk in besedila.
  • Močna - Če je dolžina 14 znakov ali več in ima kombinacijo simbolov, velikih črk in besedila.

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

Utrjevanje zahteve za geslo

Bistveno je, da v svojem Javascriptu ne preverite samo konstrukcije gesla. To bi vsem, ki imajo orodja za razvoj brskalnika, omogočilo, da obidejo skript in uporabijo katero koli geslo, ki ga želijo. VEDNO uporabite preverjanje na strani strežnika za potrditev moči gesla, preden ga shranite v svojo platformo.

34 Komentarji

  1. 1
  2. 2

    HVALA VAM! HVALA VAM! HVALA VAM! Že dva tedna se zafrkavam s prekleto kodo moči gesla z drugih spletnih strani in si vlečem lase. Vaš je kratek, deluje tako, kot hočem jaz, in kar je najboljše, začetnik javascripta ga lahko enostavno spremeni! Želel sem zajeti razsodbo o moči in ne pustiti, da se v obrazcu dejansko posodobi uporabniško geslo, razen če izpolnjuje preizkus trdnosti. Koda drugih ljudi je bila preveč zapletena ali ni delovala pravilno ali kaj drugega. Ljubim te! XXXXX

  3. 4

    hvala bogu za ljudi, ki lahko dejansko pravilno napišejo del kode.
    Imel je enake izkušnje kot Janis.

    To deluje takoj, kar je kot nalašč za ljudi, kot sem jaz, ki ne znajo kodirati javascripta!

  4. 5
  5. 6

    Živjo, najprej hvala lepa za tvoja prizadevanja, poskusil sem to uporabiti z Asp.net, vendar ni uspelo, uporabljam

    namesto oznake in ni delovalo, kakšen predlog ?!

  6. 7
  7. 8
  8. 9
  9. 10
  10. 11

    “P @ s $ w0rD” se kaže močno, čeprav bi bil z dicnarskim napadom dokaj hitro razpokan…
    Menim, da je za uvedbo takšne funkcije v profesionalno rešitev pomembno, da ta algoritem kombiniramo s preverjanjem slovarja.

  11. 12
  12. 13

    Hvala za to majhno kodo, zdaj jo lahko uporabljam za preizkus moči mojih gesel, ko moji obiskovalci vnesejo svoja gesla,

  13. 14
  14. 15
  15. 16
  16. 17
  17. 18
  18. 19

    lahko nekdo pove, zakaj to ni delovalo moje ..

    Kopiral sem vso kodo in jo prilepil v notepad ++, vendar sploh ne deluje?
    prosim pomagaj mi..

  19. 20
  20. 21
  21. 22
  22. 23
  23. 24

    Ta vrsta "preverjalnika moči" vodi ljudi po zelo nevarni poti. Vrednoti raznolikost znakov glede na dolžino gesla, zaradi česar krajša in raznolika gesla ocenjuje kot močnejša od daljših in manj raznolikih gesel. To je zmota, zaradi katere bodo uporabniki v težavah, če se kdaj srečajo z resno grožnjo vdora.

    • 25

      Ne strinjam se, Jordan! Primer je bil preprosto predstavljen kot primer scenarija. Priporočam ljudem, da z orodjem za upravljanje gesel ustvarijo neodvisne gesle za katero koli spletno mesto, ki je zanj edinstveno. Hvala!

  24. 26
  25. 27
  26. 28

    resnično cenim, da vas tokrat večkrat preiskujem, nazadnje pa sem dobil vašo objavo in sem resnično osupnil. HVALA VAM

  27. 29
  28. 31
  29. 33

    Ste varčevalec v živo! Razčlenjeval sem nize levo desno in na sredini in mislil, da obstaja boljši način, ter našel vaš del kode z uporabo regularnega izraza. Sem se lahko zataknil za mojo spletno stran ... Nimate pojma, kako zelo je to pomagalo. Najlepša hvala Douglas !!

Kaj menite?

Ta stran uporablja Akismet za zmanjšanje nezaželene pošte. Preberite, kako se vaš komentar obravnava.