Provjerite snagu lozinke pomoću JavaScript-a i regularnih izraza

Provjerite snagu lozinke pomoću JavaScript-a i regularnih izraza

Radio sam neko istraživanje kako bih pronašao dobar primjer provjere jačine lozinke koja koristi JavaScript i Regularni izrazi (Regex). U aplikaciji na mom poslu vraćamo post kako bismo provjerili snagu lozinke i prilično je nezgodno za naše korisnike.

Šta je Regex?

Regularni izraz je niz znakova koji definiraju obrazac pretraživanja. Obično takve obrasce koriste algoritmi pretraživanja nizova za pronaći or pronaći i zamijeniti operacije na stringovima ili za provjeru ulaznosti. 

Ovaj članak definitivno ne želi naučiti vas regularnim izrazima. Samo znajte da će mogućnost upotrebe regularnih izraza apsolutno pojednostaviti vaš razvoj dok tražite uzorke u tekstu. Takođe je važno napomenuti da je većina razvojnih jezika optimizovala upotrebu regularnih izraza ... pa, umjesto raščlanjivanja i pretraživanja nizova korak po korak, Regex je obično mnogo brži i na serveru i na strani klijenta.

Prilično sam pretraživao web prije nego što sam pronašao primjer nekih sjajnih Regularnih izraza koji traže kombinaciju dužine, znakova i simbola. Ipak, kod je za moj ukus bio malo pretjeran i prilagođen za .NET. Zato sam pojednostavio kod i stavio ga u JavaScript. To omogućuje provjeru snage lozinke u stvarnom vremenu u klijentovom pregledniku prije nego što je ponovo pošalje ... i pruža neke povratne informacije korisniku o snazi ​​lozinke.

Upišite lozinku

Sa svakim potezom tipkovnice, lozinka se testira u odnosu na regularni izraz, a zatim se korisniku pruža povratna informacija u rasponu ispod nje.




Upišite lozinku

Evo koda

The Regularni izrazi napravite fantastičan posao minimizirajući duljinu koda:

  • Više likova - Ako je dužina manja od 8 znakova.
  • Slabo - Ako je dužina manja od 10 znakova i ne sadrži kombinaciju simbola, velikih slova i teksta.
  • srednji - Ako je dužina 10 znakova ili više i ima kombinaciju simbola, velikih slova i teksta.
  • jak - Ako je duljina 14 znakova ili više i ima kombinaciju simbola, velikih slova i teksta.

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

Utvrđivanje zahtjeva za lozinkom

Bitno je da u svom Javascriptu ne potvrdite samo konstrukciju lozinke. To bi omogućilo svima koji imaju alate za razvoj preglednika da zaobiđu skriptu i koriste lozinku koju god žele. Uvijek biste trebali koristiti provjeru na strani poslužitelja za provjeru snage lozinke prije nego što je pohranite na svojoj platformi.

34 Komentari

  1. 1
  2. 2

    HVALA TI! HVALA TI! HVALA TI! Glumio sam se 2 sedmice s prokletim kodom za jačinu lozinke sa drugih web stranica i čupao sam kosu. Vaša je kratka, radi baš kako ja želim i najbolje od svega, laka za javascript početnike za izmjenu! Želio sam da uhvatim presudu o snazi ​​i ne dozvolim da obrasca objavi da zapravo ažurira korisničku lozinku osim ako ne prođe test snage. Kod drugih ljudi je bio previše komplikovan ili nije radio kako treba ili nešto drugo. Volim te! XXXXX

  3. 4

    hvala bogu za ljude koji zaista mogu ispravno napisati dio koda.
    Imao je isto iskustvo kao Janis.

    Ovo radi odmah iz kutije što je savršeno za ljude poput mene koji ne znaju kodirati javascript!

  4. 5
  5. 6

    Zdravo, prije svega hvala puno na trudu, pokušao sam ovo koristiti sa Asp.net-om, ali nije išlo, koristim

    umjesto oznake, i nije uspjelo, ima li prijedloga?!

  6. 7

    Za Nisreen: kod u označenom polju ne radi sa cut'n'paste. Jednostruki navodnik je zbrkan. Međutim, kod demonstracionog linka je u redu.

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

    “P@s$w0rD” se pokazuje jakom, iako bi bilo prilično brzo razbijeno napadom iz rječnika…
    Za implementaciju takve funkcije na profesionalno rješenje, vjerujem da je važno kombinirati ovaj algoritam s provjerom rječnika.

  11. 12
  12. 13

    Hvala za ovaj mali kod, sada ga mogu koristiti da testiram snagu svoje lozinke kada moji posjetitelji .unesu svoje lozinke,

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

    moze li neko reci zasto meni nije uspelo..

    kopirao sam sav kod i zalijepio ga u notepad++, ali uopće ne radi?
    molim te pomozi mi..

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

    Ova vrsta "provjere snage" vodi ljude na vrlo opasan put. On vrednuje različitost znakova u odnosu na dužinu pristupne fraze, što ga navodi da kraće, raznovrsnije lozinke ocenjuje kao jače od dužih, manje raznolikih lozinki. To je zabluda koja će dovesti vaše korisnike u nevolje ako se ikada suoče s ozbiljnom prijetnjom hakovanja.

    • 25

      Ne slažem se, Jordan! Primjer je jednostavno iznesen kao primjer skripte. Moja preporuka za ljude je da koriste alat za upravljanje lozinkama za kreiranje nezavisnih pristupnih fraza za bilo koju stranicu koja je jedinstvena za nju. Hvala!

  24. 26
  25. 27
  26. 28

    Zaista cijenim što su me ovo tražili mnogo puta, ali konačno sam dobio tvoj post i stvarno sam oduševljen. HVALA TI

  27. 29
  28. 31
  29. 33

    Vi ste spasilac uživo! Analizirao sam nizove lijevo desno i centar i pomislio da postoji bolji način i pronašao sam vaš dio koda koristeći Regex. Mogao sam da se pozabavim time za moju stranicu… Nemate pojma koliko je ovo pomoglo. Hvala puno Douglas!!

Šta ti misliš?

Ova stranica koristi Akismet kako bi smanjila neželjenu poštu. Saznajte kako se podaci vašeg komentara obrađuju.