Как скрыть всех, кроме одного персонажа, из поля пароля

Question

Итак, я провел довольно много исследований по этому вопросу, но не нашел окончательного ответа. По сути, на странице учетной записи пользователя я хочу иметь возможность отображать свой пароль со скрытыми буквами, кроме первой. Это будет выглядеть следующим образом:

Пароль: р *******

Пароль будет тянуть как обычной строки из базы данных, то нужно скрыть, прежде чем помещается в соответствующее текстовое поле. Как я могу выполнить это в javascript?

Добавлена ​​информация

• Я хотел бы иметь пароль, сохраненный в нормальном <p> или <h3> Tag - не редактируемые пользователем, пока запрошенный (я не буду обращаться с этим).
• Все пароли в настоящее время хранятся в базе данных firebase.

Answer 1

Как и многие другие, это не рекомендуется делать с помощью JavaScript. Для этого с помощью JavaScript требуется, чтобы пароль отправлялся с открытым текстом, который отображается всем, кто отслеживает в сети пользователя. Было бы гораздо лучше скрыть символы на сервере, а затем отправить результат в браузер. Выполнение этого полностью с помощью JavaScript - ОГРОМНЫЙ риск для безопасности. Подумайте внимательно, прежде чем делать это таким образом.

Этот ответ предполагает, что вы хотите, чтобы переменная хранила фактический пароль пользователя для последующего использования. Переменная password содержит фактический пароль. Текстовое поле содержит только первую букву, а все остальные символы - *.

window.addEventListener('load',function(){ 
 
    var passwordBox = document.getElementById('password'); 
 
    var password; 
 
    passwordBox.addEventListener('input',function(){ 
 
    password = this.value; 
 
    this.value = ''; 
 
    var characters = password.split(''); 
 
    if(characters.length > 0){ 
 
     this.value = characters[0]; 
 
     for(var i = 1; i < characters.length; i++){ 
 
      this.value += '*'; 
 
     } 
 
    } 
 
    }); 
 
});

<input type="text" id="password">

Answer 2

Строка маскирования

Если вы просто строку пароля, и вы хотите строку звездочками:

function mask(str){ 
return str.split("").map((e,i)=>i?"*":e).join(""); 
} 

Используйте так:

alert(mask("supersecretpass")); 

Входной маскирующий

window.onload=function(){ 
    var passelem=;//add your input elem here 
    var password="";//the real password 
    passelem.oninput=function(){ 
     if(password.length>this.value.length){ 
     //user pressed backspace... 
     var arr=password.split(""); 
     arr.pop();//remove last char 
     password=arr.join(""); 
     return; 
     } 
     password+=this.value.split("").pop();//add added char to password 
     this.value=password.split("")[0];//add first char 
     for(i=1;i<password.length;i++){ 
      this.value+="*";//add the * 
     } 
    }; 
    //kill arrows 
    document.onkeydown=function(e){ 
    if(e.wich==33||e.wich==34){ 
    e.preventDefault(); 
    return false; 
    } 
    }; 
}; 

Как и www139s ответ, но с правильным выходом пароля ...

Answer 3

Вторых Последнее, что вы должны сделать, это прохождение паролей пользователей в виде простого текста. Третья последняя вещь, которую вы должны сделать, это заменить символы пароля на javascript. Оба они позволяют несанкционированным лицам раскрыть пароль вашего пользователя. Но самое последнее, что вам нужно сделать, это хранить пароли пользователей в вашей БД в простой форме, что позволяет не ущемленным лицам получать все пароли ваших пользователей.

Даже если вы заменяете символы пароля на стороне сервера и отправляете их обратно в форме «p *******», как предложили другие, вы даете четкий сигнал о том, что вы храните пароли своих пользователей в не- зашифрованную форму, поэтому ваш сайт, скорее всего, подвергнется нападению.

Пожалуйста, помните, что большинство, если не все пакеты/фреймворки предоставляют поддержку управления пользователями, включая по крайней мере базовое шифрование по умолчанию, как и FOSUserBundle.