Ellenőrizze a jelszó erősségét a JavaScript és a reguláris kifejezések segítségével

Ellenőrizze a jelszó erősségét a JavaScript és a reguláris kifejezések segítségével

Néhány kutatást folytattam annak érdekében, hogy jó példát találjak egy Jelszóerősség-ellenőrzőre, amely használja JavaScript és Reguláris kifejezések (Regex). A munkámban lévő alkalmazásban visszaküldjük a jelszó erősségének ellenőrzését, és ez elég kényelmetlen a felhasználóink ​​számára.

Mi a Regex?

A reguláris kifejezés egy olyan karaktersorozat, amely meghatározza a keresési mintát. Az ilyen mintákat általában karakterlánc-kereső algoritmusok használják talál or megtalálni és pótolni karakterláncokon végzett műveletek vagy bemeneti ellenőrzés. 

Ez a cikk biztosan nem arra szolgál, hogy rendszeres kifejezéseket tanítson. Csak tudd, hogy a reguláris kifejezések használatának képessége abszolút leegyszerűsíti a fejlesztést, amikor mintákat keres a szövegben. Fontos megjegyezni azt is, hogy a legtöbb fejlesztési nyelv optimalizálta a rendszeres kifejezés használatát ... ezért a karakterláncok lépésenkénti elemzése és keresése helyett a Regex általában sokkal gyorsabb mind szerver, mind kliens oldalon.

Elég sokat kerestem az interneten, mire megtaláltam egy példa néhány nagyszerű reguláris kifejezés közül, amelyek hosszúság, karakterek és szimbólumok kombinációját keresik. A kód azonban kissé túlzott volt az ízlésemnek és a .NET-re szabott. Tehát egyszerűsítettem a kódot, és JavaScript-be tettem. Ez lehetővé teszi a jelszó erősségének valós idejű ellenőrzését az ügyfél böngészőjében, mielőtt visszaküldené ... és visszajelzést ad a felhasználónak a jelszó erősségéről.

Írja be a jelszót

A billentyűzet minden egyes löketével tesztelik a jelszót a reguláris kifejezéssel szemben, majd visszajelzést adnak a felhasználónak az alatta lévő tartományban.




Írja be a jelszót

Itt a kódex

A Reguláris kifejezések fantasztikus munkát végez a kód hosszának minimalizálása érdekében:

  • További karakterek - Ha a hossz kevesebb, mint 8 karakter.
  • Gyenge - Ha a hossz kevesebb, mint 10 karakter, és nem tartalmaz szimbólumok, nagybetűk, szöveg kombinációját.
  • közepes - Ha a hossza legalább 10 karakter, és szimbólumok, nagybetűk, szöveg kombinációja van.
  • Erős - Ha a hossza legalább 14 karakter, és szimbólumok, nagybetűk, szöveg kombinációja van.

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

A jelszó igénylés keményítése

Alapvető fontosságú, hogy ne csak a jelszó szerkesztését érvényesítse a Javascripten belül. Ez lehetővé tenné, hogy bárki, aki rendelkezik böngészőfejlesztő eszközökkel, megkerülje a szkriptet, és bármilyen jelszót használjon, amelyet szeretne. A jelszó erősségének érvényesítéséhez MINDIG szerveroldali ellenőrzést kell használnia, mielőtt azt a platformján tárolná.

34 Comments

  1. 1
  2. 2

    KÖSZÖNÖM! KÖSZÖNÖM! KÖSZÖNÖM! 2 hete hülyéskedem más weboldalakról származó, rohadt jelszóerősségi kóddal, és kihúzom a hajam. A tiéd rövid, úgy működik, ahogy szeretném, és ami a legjobb, a javascript kezdők számára könnyen módosítható! Azt akartam, hogy rögzítse az erősségi ítéletet, és ne hagyjam, hogy az űrlap ténylegesen frissítse a felhasználó jelszavát, hacsak nem teljesíti az erőtesztet. Mások kódja túl bonyolult volt, vagy nem működött megfelelően, vagy valami más. Szeretlek! XXXX

  3. 4

    hála istennek az emberekért, akik valóban meg tudnak írni egy kódrészletet rendesen.
    Ugyanazok a tapasztalatok, mint Janis.

    Ez azonnal működik, és tökéletes olyan emberek számára, mint én, akik nem tudják kódolni a javascriptet!

  4. 5
  5. 6

    Szia, először is nagyon köszönöm az erőfeszítéseidet, megpróbáltam használni ezt az Asp.net segítségével, de nem működött, használom

    címke helyett, és nem működött, van valami javaslat?!

  6. 7

    Nisreennek: a kiemelt mezőben lévő kód nem működik cut'n'paste esetén. Az egyetlen idézet elrontott. A bemutató link kódja viszont rendben van.

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

    A „P@s$w0rD” erősen mutat, bár egy szótári támadással elég gyorsan feltörné…
    Egy ilyen funkció professzionális megoldásban való telepítéséhez fontosnak tartom, hogy ezt az algoritmust egy szótárellenőrzéssel kombináljuk.

  11. 12
  12. 13

    Köszönöm ezt a kis kódot, most már használhatom jelszavam erősségének tesztelésére, amikor a látogatóim beírják a jelszavaikat,

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

    valaki meg tudja mondani, hogy az enyém miért nem működött?

    kimásoltam az összes kódot, és beillesztem a notepad++-ba, de egyáltalán nem működik?
    kérlek segíts..

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

    Ez a fajta „erőellenőrző” nagyon veszélyes útra vezeti az embereket. A karakterek sokféleségét az összetett jelszavak hosszával szemben értékeli, így a rövidebb, változatosabb jelszavakat erősebbnek minősíti, mint a hosszabb, kevésbé változatos jelszavakat. Ez egy tévedés, amely bajba sodorja a felhasználókat, ha valaha is komoly hackerfenyegetéssel szembesülnek.

    • 25

      Nem értek egyet, Jordan! A példa egyszerűen a forgatókönyv példájaként lett kiadva. Azt javaslom az embereknek, hogy használjanak egy jelszókezelő eszközt, amellyel független jelszavakat hozhatnak létre bármely webhelyhez, amely egyedi. Kösz!

  24. 26
  25. 27
  26. 28

    Nagyon hálás vagyok, hogy sokszor kerestem, de végül megkaptam a bejegyzésedet, és nagyon le vagyok nyűgözve. KÖSZÖNÖM

  27. 29
  28. 31
  29. 33

    Élőben megmentő vagy! A karakterláncokat balra jobbra és középre elemeztem, és arra gondoltam, hogy van jobb módszer, és a Regex segítségével megtaláltam a kódrészletet. Sikerült rámenni a webhelyemre… Fogalma sincs, mennyit segített ez. Köszönöm szépen Douglas!!

Mit gondolsz?

Ez az oldal Akismet-et használ a levélszemét csökkentése érdekében. Ismerje meg, hogyan dolgozik a megjegyzésed.