最近在学习前端的一些内容,感觉这个 js 的表单加密还是挺重要的。
表单明码加密,晋升网站安全性。
间接设置 pwd.value=md5(pwd.value);
会造成明码回显,用户体验不行
间接增加个 hidden
标签,设置 mpwd.value=md5(pwd.value);
,提交表单
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<!-- <script>
var d1 = document.getElementById('d1');
var father = document.getElementById('father');
</script> -->
<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js"></script>
</head>
<body>
<div>
<form action=""onsubmit="return check()">
<div><span> 用户名:</span>
<input type="text" name="name" id="name">
</div>
<div>
<span> 明码:</span>
<!-- 不设置明码框的 name,提交表单拿到 hidden 中加密的数据 -->
<input type="password" id="pwd">
<input type="hidden" name="pwd" id="md5-pwd">
</div>
<div>
<input type="submit"></input>
</div>
</form>
</div>
<script>
function check(){var pwd=document.getElementById('pwd');
var mpwd=document.getElementById('md5-pwd');
//md5 加密
mpwd.value=md5(pwd.value);
//pwd.value=md5(pwd.value);
//onsubmit 外面校验,true 为通过提交,false 就是阻止提交
return true;
}
</script>
</body>
</html>