Измените значение формы перед отправкой, не изменяя показанное значение

#javascript #php #forms

Вопрос:

Я работаю над сайтом для входа на PHP и Javascript. Но перед отправкой имени пользователя и пароля пароль должен быть зашифрован.

Для этого я использую следующий код (пожалуйста, не обращайте внимания на метод get, это нормально) :

 <form name="myForm" action="home" method="get">
      <div class="form-group pb-3 pt-0">
        <label for="password"><?= $content['MyAvatarConnexion']['password'] ?></label>
        <input type="password" id="password" name="password" class="form-control"
          placeholder="<?= $content['MyAvatarConnexion']['inputPassword'] ?>">
      </div>        
</form>
 

И я добавляю прослушиватель, который вызывает шифровальщик, который работает с обещанием.

 <script>
const form = document.forms["myForm"];
  form.addEventListener('submit', (e) => {
    e.preventDefault();
    function callback(encryptstring){form.password.value = encryptstring; form.submit(); }
    var encrypter = new Encrypter(form.password.value, callback);
  });
</script>
 

Однако изменение работает, когда я нажимаю кнопку «Отправить» и перед изменением страницы я вижу, что введенный пароль переключается с чистого пароля на зашифрованный пароль.

Я пытался поместить form.password.hidden = true; , но это меняет весь макет страницы перед изменением страницы, что не совсем эстетично.

Как я могу изменить значение, не изменяя показанное значение ?

Комментарии:

1. Вы можете использовать скрытое поле и установить значение этого вместо исходного пароля.

2. Зачем утруждать себя шифрованием на клиенте? Ваш веб-сайт должен использовать SSL, поэтому хэшируйте пароль на сервере с помощью password_hash() перед его сохранением и проверьте его позже с помощью password_verfiy()

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

4. @mohitjain Я сделаю, как ты говоришь. Я думал об этом, но я не знаю, есть ли какой-либо другой способ, потому что я думал, что это было бы много для довольно маленькой проблемы. Спасибо за ваш ответ.

5. @JamesGlendenning и TangentiallyPerpendicular На самом деле, я не знаю, почему шифрование происходит на стороне клиента. Я спрошу своего репетитора по стажировке.