CRM y plataformas de datosMarketing por correo electrónico y automatización

Compruebe la seguridad de la contraseña con JavaScript o jQuery y expresiones regulares (¡también con ejemplos del lado del servidor!)

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 de 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 grandes 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 estaba hecho a medida 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.

Función de seguridad de la contraseña de JavaScript

La Expresiones regulares Haga un trabajo fantástico al minimizar la longitud del código. Esta función de JavaScript comprueba la seguridad de una contraseña y si frustrarla es fácil, media, difícil o extremadamente difícil de adivinar. A medida que la persona escribe, muestra consejos para animarla a ser más fuerte. Valida la contraseña en base a:

  • Longitud Mínima – Si la longitud es inferior o superior a 8 caracteres.
  • Caso mixto – Si la contraseña tiene mayúsculas y minúsculas.
  • Números – Si la contraseña incluye números.
  • Caracteres especiales – Si la contraseña incluye caracteres especiales.

La función muestra la dificultad, así como algunos consejos para fortalecer aún más la contraseña.

function checkPasswordStrength(password) {
  // Initialize variables
  var strength = 0;
  var tips = "";

  // Check password length
  if (password.length < 8) {
    tips += "Make the password longer. ";
  } else {
    strength += 1;
  }

  // Check for mixed case
  if (password.match(/[a-z]/) && password.match(/[A-Z]/)) {
    strength += 1;
  } else {
    tips += "Use both lowercase and uppercase letters. ";
  }

  // Check for numbers
  if (password.match(/\d/)) {
    strength += 1;
  } else {
    tips += "Include at least one number. ";
  }

  // Check for special characters
  if (password.match(/[^a-zA-Z\d]/)) {
    strength += 1;
  } else {
    tips += "Include at least one special character. ";
  }

  // Return results
  if (strength < 2) {
    return "Easy to guess. " + tips;
  } else if (strength === 2) {
    return "Medium difficulty. " + tips;
  } else if (strength === 3) {
    return "Difficult. " + tips;
  } else {
    return "Extremely difficult. " + tips;
  }
}

Si desea actualizar el color de la punta, también puede hacerlo actualizando el código después de la // Return results la línea.

// Get the paragraph element
  var strengthElement = document.getElementById("passwordStrength");

  // Return results
  if (strength < 2) {
    strengthElement.textContent = "Easy to guess. " + tips;
    strengthElement.style.color = "red";
  } else if (strength === 2) {
    strengthElement.textContent = "Medium difficulty. " + tips;
    strengthElement.style.color = "orange";
  } else if (strength === 3) {
    strengthElement.textContent = "Difficult. " + tips;
    strengthElement.style.color = "black";
  } else {
    strengthElement.textContent = "Extremely difficult. " + tips;
    strengthElement.style.color = "green";
  }

Función de seguridad de la contraseña de jQuery

Con jQuery, en realidad no tenemos que escribir el formulario con una actualización de entrada:

<form>
    <label for="password">Enter password:</label>
    <input type="password" id="password">
    <p id="password-strength"></p>
</form>

También podemos modificar el color de los mensajes si lo deseamos. 

$(document).ready(function() {
    $('#password').on('input', function() {
        var password = $(this).val();
        var strength = 0;
        var tips = "";
  
        // Check password length
        if (password.length < 8) {
            tips += "Make the password longer. ";
        } else {
            strength += 1;
        }
  
        // Check for mixed case
        if (password.match(/[a-z]/) && password.match(/[A-Z]/)) {
            strength += 1;
        } else {
            tips += "Use both lowercase and uppercase letters. ";
        }
  
        // Check for numbers
        if (password.match(/\d/)) {
            strength += 1;
        } else {
            tips += "Include at least one number. ";
        }
  
        // Check for special characters
        if (password.match(/[^a-zA-Z\d]/)) {
            strength += 1;
        } else {
            tips += "Include at least one special character. ";
        }
  
        // Update the text and color based on the password strength
        var passwordStrengthElement = $('#password-strength');
        if (strength < 2) {
            passwordStrengthElement.text("Easy to guess. " + tips);
            passwordStrengthElement.css('color', 'red');
        } else if (strength === 2) {
            passwordStrengthElement.text("Medium difficulty. " + tips);
            passwordStrengthElement.css('color', 'orange');
        } else if (strength === 3) {
            passwordStrengthElement.text("Difficult. " + tips);
            passwordStrengthElement.css('color', 'black');
        } else {
            passwordStrengthElement.text("Extremely difficult. " + tips);
            passwordStrengthElement.css('color', 'green');
        }
    });
});

Endurecimiento de su solicitud de contraseña

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

Función PHP para la seguridad de la contraseña

function checkPasswordStrength($password) {
  // Initialize variables
  $strength = 0;

  // Check password length
  if (strlen($password) < 8) {
    return "Easy to guess";
  } else {
    $strength += 1;
  }

  // Check for mixed case
  if (preg_match("/[a-z]/", $password) && preg_match("/[A-Z]/", $password)) {
    $strength += 1;
  }

  // Check for numbers
  if (preg_match("/\d/", $password)) {
    $strength += 1;
  }

  // Check for special characters
  if (preg_match("/[^a-zA-Z\d]/", $password)) {
    $strength += 1;
  }

  // Return strength level
  if ($strength < 2) {
    return "Easy to guess";
  } else if ($strength === 2) {
    return "Medium difficulty";
  } else if ($strength === 3) {
    return "Difficult";
  } else {
    return "Extremely difficult";
  }
}

Función de Python para la seguridad de la contraseña

def check_password_strength(password):
  # Initialize variables
  strength = 0

  # Check password length
  if len(password) < 8:
    return "Easy to guess"
  else:
    strength += 1

  # Check for mixed case
  if any(char.islower() for char in password) and any(char.isupper() for char in password):
    strength += 1

  # Check for numbers
  if any(char.isdigit() for char in password):
    strength += 1

  # Check for special characters
  if any(not char.isalnum() for char in password):
    strength += 1

  # Return strength level
  if strength < 2:
    return "Easy to guess"
  elif strength == 2:
    return "Medium difficulty"
  elif strength == 3:
    return "Difficult"
  else:
    return "Extremely difficult"

Función C# para la seguridad de la contraseña

public string CheckPasswordStrength(string password) {
  // Initialize variables
  int strength = 0;

  // Check password length
  if (password.Length < 8) {
    return "Easy to guess";
  } else {
    strength += 1;
  }

  // Check for mixed case
  if (password.Any(char.IsLower) && password.Any(char.IsUpper)) {
    strength += 1;
  }

  // Check for numbers
  if (password.Any(char.IsDigit)) {
    strength += 1;
  }

  // Check for special characters
  if (password.Any(ch => !char.IsLetterOrDigit(ch))) {
    strength += 1;
  }

  // Return strength level
  if (strength < 2) {
    return "Easy to guess";
  } else if (strength == 2) {
    return "Medium difficulty";
  } else if (strength == 3) {
    return "Difficult";
  } else {
    return "Extremely difficult";
  }
}

Función Java para la seguridad de la contraseña

public String checkPasswordStrength(String password) {
  // Initialize variables
  int strength = 0;

  // Check password length
  if (password.length() < 8) {
    return "Easy to guess";
  } else {
    strength += 1;
  }

  // Check for mixed case
  if (password.matches(".*[a-z].*") && password.matches(".*[A-Z].*")) {
    strength += 1;
  }

  // Check for numbers
  if (password.matches(".*\\d.*")) {
    strength += 1;
  }

  // Check for special characters
  if (password.matches(".*[^a-zA-Z\\d].*")) {
    strength += 1;
  }

  // Return strength level
  if (strength < 2) {
    return "Easy to guess";
  } else if (strength == 2) {
    return "Medium difficulty";
  } else if (strength == 3) {
    return "Difficult";
  } else {
    return "Extremely difficult";
  }
}

Y si solo está buscando un excelente generador de contraseñas, he creado una pequeña herramienta en línea para eso.

Generador de contraseñas

Douglas Karr

Douglas Karr es CMO de AbrirINSIGHTS y el fundador de la Martech Zone. Douglas ha ayudado a docenas de nuevas empresas exitosas de MarTech, ha colaborado en la diligencia debida de más de $5 mil millones en adquisiciones e inversiones de Martech y continúa ayudando a las empresas a implementar y automatizar sus estrategias de ventas y marketing. Douglas es un orador y experto en transformación digital y MarTech reconocido internacionalmente. Douglas también es autor de una guía para principiantes y de un libro sobre liderazgo empresarial.

Artículos Relacionados

Volver al botón superior
Cerrar

Adblock detectado

Martech Zone puede proporcionarle este contenido sin costo porque monetizamos nuestro sitio a través de ingresos publicitarios, enlaces de afiliados y patrocinios. Le agradeceríamos que elimine su bloqueador de anuncios mientras visita nuestro sitio.