Как передать значение переменной JavaScript в функцию golang с помощью шаблона HTML
У меня есть веб-приложение GO, использующее функцию шаблонов HTML. Я пытаюсь зашифровать пароль пользователя перед его отправкой в форму. Шаги для достижения этой цели:
- Используйте JavaScript для захвата необработанного значения, переданного пользователем в поле ввода.
- Вызовите функцию шифрования Go, предоставленную в шаблоне Go, которая принимает параметр пароля, который возвращает зашифрованное значение.
- Новое зашифрованное значение затем должно быть перенаправлено в качестве нового значения пароля в значение формы POST.
Однако, поскольку перечисленные шаги выполняются, ожидаемый результат неверен. Вместо шифрования входного значения он шифрует имя переменной, как показано ниже.
username: mass
encrypted: ABZT7a7K+l7uMu2ZMq/K8ucyJKwdq0TVTmKlShBLo40iPeA3U2Pm9oTCCw==
decrypted: ' + raw_val + '
Итак, как мне получить значение JavaScript, передаваемое в функцию шифрования, а не имя переменной? Я не очень хорошо знаком с JavaScript, поэтому либо я неправильно объединяю строки, либо пытаюсь сделать невозможное, но я не в курсе.
Ниже приведен исходный код HTML, который есть в шаблоне.
<!DOCTYPE html>
<html>
<head></head>
<title>Buy Bot</title>
<body>
<form name = "login" action = "/login" method = "POST" onsubmit = "encrypt()">
<div>
<label for = "username">username:</label>
<input id = "username" type = "text" name = "username" placeholder = {{.KycInfo}} required>
<div>
</br>
<div>
<label for = "password">password:</label>
<input id = "password" type = "password" name = "password" placeholder = "password" required>
</div>
</br>
<div>
remember me <input id = "rememberme" type = "checkbox" name = "rememberme">
</div>
</br>
<div>
<input type = "submit" value = "login">
</div>
</form>
</body>
</html>
<script
type = "text/javascript">
function encrypt(){
var raw_val = document.getElementById("password").value
console.info("password: ",raw_val)
let encrypted = '{{.Encrypt "' + raw_val + '"}}'
console.info("encrypted: ",encrypted)
document.login.password.value = encrypted;
return true;
}
</script>
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы не можете передать значение переменной JavaScript в функцию Go с помощью шаблона (шаблон уже будет создан на клиенте при присвоении значения переменной JavaScript).
В форме входа вы обычно отправляете необработанное значение пароля и шифруете/хешируете его на стороне сервера. Вы уже должны безопасно отправлять пароль с помощью SSL.
Именно поэтому я и пошел по этому маршруту
Проблема, с которой вы столкнулись, возникает из-за того, что шаблон Go пытается оценить выражение во время визуализации шаблона, а не при запуске JavaScript в браузере. Таким образом, вместо того, чтобы передавать переменную raw_val JavaScript в функцию Go {{.Encrypt}}, механизм шаблонов видит ее как литеральную строку и пытается разрешить ее перед отправкой страницы в браузер.
Чтобы решить эту проблему, вам следует полностью обрабатывать шифрование в JavaScript. Вы не можете вызывать функции Go напрямую из JavaScript. Вместо этого вам следует реализовать логику шифрования в JavaScript. Вот как это можно сделать:
Удалите вызов функции Go Encrypt из шаблона. Реализуйте шифрование непосредственно в JavaScript. Для этого вы можете использовать библиотеку JavaScript, например CryptoJS, для шифрования.
<!DOCTYPE html>
<html>
<head></head>
<title>Buy Bot</title>
<body>
<form name = "login" action = "/login" method = "POST" onsubmit = "encrypt()">
<div>
<label for = "username">username:</label>
<input id = "username" type = "text" name = "username" placeholder = {{.KycInfo}} required>
</div>
</br>
<div>
<label for = "password">password:</label>
<input id = "password" type = "password" name = "password" placeholder = "password" required>
</div>
</br>
<div>
remember me <input id = "rememberme" type = "checkbox" name = "rememberme">
</div>
</br>
<div>
<input type = "submit" value = "login">
</div>
</form>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
<script type = "text/javascript">
function encrypt(){
var raw_val = document.getElementById("password").value;
console.info("password: ", raw_val);
// Encrypting the password using CryptoJS
var encrypted = CryptoJS.AES.encrypt(raw_val, "your-secret-key").toString();
console.info("encrypted: ", encrypted);
document.login.password.value = encrypted;
return true;
}
</script>
</body>
</html>Это был мой первоначальный маршрут, но, как упоминалось goproxy.dev, это незащищенный маршрут.
Обратите внимание, что шифрование пароля на стороне клиента, как предложено здесь stackoverflow.com/a/78920352/26956009, может представлять угрозу безопасности, поскольку вы рискуете раскрыть свой секретный ключ.