Gerar Senha Segura no JavaScript

Precisando de uma função simples para gerar Senha Segura no JavaScript? Tenho uma aqui para você 🙂

Na função demonstrada abaixo você pode gerar uma sequencia de caracteres aleatórios, onde é possível passar para a função quais tipos de caracteres devem estar na senha, veja:

// Gostou? Considere enviar um café para o PIX: cafe@jonatanwolf.com.br.
function GerarSenhaSegura(tamanho, usaMinusculas, usaMaiusculas, usaNumeros, usaEspeciais) {
    let caracteres = "";

    if (usaMinusculas)
        caracteres += "abcdefghijklmnopqrstuvwxyz";

    if (usaMaiusculas)
        caracteres += "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

    if (usaNumeros)
        caracteres += "0123456789";

    if (usaEspeciais)
        caracteres += "[]-*!%@&^#";

    if (!caracteres)
        return "";

    let senha = "";
    let quantidadeCaracteres = caracteres.length - 1;
    let permiteRepetirCaracteres = tamanho > quantidadeCaracteres;
    for (let indice = 1; indice <= tamanho; indice++) {
        let indiceAleatorio = Math.floor(Math.random() * quantidadeCaracteres);
        let caractereAleatorio = caracteres[indiceAleatorio];
        senha += caractereAleatorio;

        if (!permiteRepetirCaracteres) {
            caracteres = caracteres.replace(caractereAleatorio, "");
            quantidadeCaracteres--;
        }
    }

    return senha;
}

Para executar a função, é muito simples, veja:

function GerarSenha() {
    const campoSenha = document.getElementById("campoSenhaSeguraGerada");
    const tamanho = document.getElementById("campoTamanho").value;
    const usaMinusculas = document.getElementById("campoUsaMinusculas").checked;
    const usaMaiusculas = document.getElementById("campoUsaMaiusculas").checked;
    const usaNumeros = document.getElementById("campoUsaNumeros").checked;
    const usaEspeciais = document.getElementById("campoUsaEspeciais").checked;

    campoSenha.value = GerarSenhaSegura(tamanho, usaMinusculas, usaMaiusculas, usaNumeros, usaEspeciais);
}

No HTML, as implementações ficaram assim:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Geração de Senha Segura</title>
    <script src="GeracaoSenhaSegura.js"></script>
</head>

<body>
    <!-- https://jonatanwolf.com.br -->
    <input type="checkbox" id="campoUsaMinusculas" name="campoUsaMinusculas" checked />
    <label for="campoUsaMinusculas">Usa Caracteres Minúsculos (az)?</label><br />

    <input type="checkbox" id="campoUsaMaiusculas" name="campoUsaMaiusculas" checked />
    <label for="campoUsaMaiusculas">Usa Caracteres Maiúsculos (AZ)?</label><br />

    <input type="checkbox" id="campoUsaNumeros" name="campoUsaNumeros" checked />
    <label for="campoUsaNumeros">Usa Números (0-9)?</label><br />

    <input type="checkbox" id="campoUsaEspeciais" name="campoUsaEspeciais" checked />
    <label for="campoUsaEspeciais">Usa Caracteres Especiais ([]-*!%@&^#)?</label><br />

    <label>Tamanho</label>
    <input type="number" id="campoTamanho" value="12" style="width: 50px;" maxlength="2" />

    <br /><br />

    <label>Senha Segura</label><br />
    <input type="text" id="campoSenhaSeguraGerada"><br />
    <button onclick="GerarSenha()">Gerar Senha</button>
</body>

</html>

Você pode obter este código completo aqui: https://github.com/solucaodev/sdlab/tree/main/JS/Geradores/SenhaSegura.

Você pode ver este código em funcionamento neste post: https://jonatanwolf.com.br/ferramentas/gerar-senha-segura-online.

Até a próxima 🙂

Comments

No comments yet. Why don’t you start the discussion?

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

This site uses Akismet to reduce spam. Learn how your comment data is processed.