关于javascript:javascript-表单-md5-加密处理

31次阅读

共计 1014 个字符，预计需要花费 3 分钟才能阅读完成。

最近在学习前端的一些内容，感觉这个 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>

正文完