Verifique la fuerza de la contraseña con JavaScript y expresiones regulares

Verifique la fuerza de la contraseña con JavaScript y expresiones regulares

Estaba investigando un poco para encontrar un buen ejemplo de un verificador de seguridad de contraseña que use JavaScript y Expresiones regulares (Regex). En la aplicación en mi trabajo, hacemos una publicación para verificar la seguridad de la contraseña y es bastante inconveniente para nuestros usuarios.

¿Qué es Regex?

Una expresión regular es una secuencia de caracteres que define un patrón de búsqueda. Normalmente, estos patrones son utilizados por algoritmos de búsqueda de cadenas para encontrar or encontrar y reemplazar operaciones en cadenas, o para la validación de entrada. 

Este artículo definitivamente no es para enseñarle expresiones regulares. Solo sepa que la capacidad de usar expresiones regulares simplificará absolutamente su desarrollo mientras busca patrones en el texto. También es importante tener en cuenta que la mayoría de los lenguajes de desarrollo han optimizado el uso de expresiones regulares ... así que en lugar de analizar y buscar cadenas paso a paso, Regex suele ser mucho más rápido tanto en el servidor como en el cliente.

Busqué bastante en la web antes de encontrar un ejemplo de algunas excelentes expresiones regulares que buscan una combinación de longitud, caracteres y símbolos. Sin embargo, el código era un poco excesivo para mi gusto y diseñado para .NET. Así que simplifiqué el código y lo puse en JavaScript. Esto hace que valide la seguridad de la contraseña en tiempo real en el navegador del cliente antes de volver a publicarla ... y proporciona algunos comentarios al usuario sobre la seguridad de la contraseña.

Teclea una contraseña

Con cada golpe del teclado, la contraseña se compara con la expresión regular y luego se proporciona información al usuario en un intervalo debajo de ella.




Escriba contraseña

Aquí está el código

El Expresiones regulares haz un trabajo fantástico al minimizar la longitud del código:

  • Mas personajes - Si la longitud es inferior a 8 caracteres.
  • Débil - Si la longitud es inferior a 10 caracteres y no contiene una combinación de símbolos, mayúsculas, texto.
  • Mediano - Si la longitud es de 10 caracteres o más y tiene una combinación de símbolos, mayúsculas y texto.
  • Fuerte , Si la longitud es de 14 caracteres o más y tiene una combinación de símbolos, mayúsculas y texto.

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

Endurecimiento de su solicitud de contraseña

Es esencial que no solo valide la construcción de la contraseña dentro de su Javascript. Esto permitiría a cualquier persona con herramientas de desarrollo de navegador omitir el script y usar la contraseña que quisiera. SIEMPRE debe utilizar una verificación del lado del servidor para validar la seguridad de la contraseña antes de almacenarla en su plataforma.

34 Comentarios

  1. 1
  2. 2

    ¡GRACIAS! ¡GRACIAS! ¡GRACIAS! He estado jugando durante 2 semanas con el maldito código de seguridad de la contraseña de otros sitios web y tirando de mi cabello. El suyo es corto, funciona como yo quiero y, lo mejor de todo, ¡fácil de modificar para un principiante en JavaScript! Quería capturar el veredicto de fuerza y ​​no dejar que el formulario se publique para actualizar realmente la contraseña del usuario a menos que cumpla con la prueba de fuerza. El código de otras personas era demasiado complicado o no funcionaba bien o algo más. ¡Te quiero! XXXXX

  3. 4

    gracias a Dios por las personas que pueden escribir correctamente un fragmento de código.
    Tenía la misma experiencia que Janis.

    Esto funciona desde el primer momento, lo que es perfecto para personas como yo que no pueden codificar javascript.

  4. 5
  5. 6

    Hola, en primer lugar, muchas gracias por tus esfuerzos, intenté usar esto con Asp.net pero no funcionó, estoy usando

    en lugar de etiquetar, y no funcionó, ¿alguna sugerencia?

  6. 7

    Para Nisreen: el código del cuadro resaltado no funciona con cortar y pegar. La comilla simple está desordenada. Sin embargo, el código del enlace de demostración está bien.

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

    "P @ s $ w0rD" se muestra fuerte, aunque se descifraría bastante rápido con un ataque de diccionario ...
    Para implementar esta característica en una solución profesional, creo que es importante combinar este algoritmo con una verificación de diccionario.

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

    ¿Alguien puede decir por qué no funcionó el mío?

    Copié todo el código y lo pegué en el bloc de notas ++, pero ¿no funciona en absoluto?
    please help me ..

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

    Este tipo de "verificador de fuerza" lleva a las personas por un camino muy peligroso. Valora la diversidad de caracteres sobre la longitud de la frase de contraseña, lo que lo lleva a calificar las contraseñas más cortas y diversas como más seguras que las más largas y menos diversas. Esa es una falacia que pondrá a sus usuarios en problemas si alguna vez enfrentan una seria amenaza de piratería.

    • 25

      ¡No estoy en desacuerdo, Jordan! El ejemplo se presentó simplemente como un ejemplo del guión. Mi recomendación para las personas es utilizar una herramienta de administración de contraseñas para crear frases de contraseña independientes para cualquier sitio que sea exclusivo de él. ¡Gracias!

  24. 26
  25. 27
  26. 28
  27. 29
  28. 31
  29. 33

    ¡Eres un salvavidas! Estaba analizando cadenas de izquierda a derecha y centro y pensé que había una mejor manera y encontré su pieza de código usando Regex. Pude jugar con él para mi sitio ... No tienes idea de cuánto ayudó esto. Muchas gracias Douglas !!

¿Qué piensas?

Este sitio usa Akismet para reducir el correo no deseado. Descubra cómo se procesan los datos de sus comentarios.