前端在登录时如何将用户密码加密

之前用到的是md5，但是最近发现有个新的加密方法AES，和后台沟通后，便拿来试了试。

首先在项目文件夹中创建AES.js，js代码如下：

至此，搞定啦！！！

}

1.  

   // npm i crypto-js --save下载先,然后引包
    
   import CryptoJS from "crypto-js";
    
   export default {
     //随机生成指定数量的16进制key
     generatekey(num) {
       let library =
         "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
       let key = "";
       for (var i = 0; i < num; i++) {
         let randomPoz = Math.floor(Math.random() * library.length);
         key += library.substring(randomPoz, randomPoz + 1);
       }
       return key;
     },
    
     //加密
     encrypt(word, keyStr) {
       keyStr = keyStr ? keyStr : "123456{saltZX}.."; //判断是否存在key，不存在就用定义好的key
       var key = CryptoJS.enc.Utf8.parse(keyStr);
       var srcs = CryptoJS.enc.Utf8.parse(word);
       var encrypted = CryptoJS.AES.encrypt(srcs, key, {
         mode: CryptoJS.mode.ECB,
         padding: CryptoJS.pad.Pkcs7
       });
       return encrypted.toString();
     },
     //解密
     decrypt(word, keyStr) {
       keyStr = keyStr ? keyStr : "abcdsxyzhkj12345";
       var key = CryptoJS.enc.Utf8.parse(keyStr);
       var decrypt = CryptoJS.AES.decrypt(word, key, {
         mode: CryptoJS.mode.ECB,
         padding: CryptoJS.pad.Pkcs7
       });
       return CryptoJS.enc.Utf8.stringify(decrypt).toString();
     }
   };

   然后在需要的页面引入AES.js文件：

2. import AES from "../../src/uitls/AES";
   

   我这里是在登录时用到的，具体操作如下：

3.  // 用AES给密码加密
    const keys = AES.generatekey(16);
    //如果是对象/数组的话，需要先JSON.stringify转换成字符串，第二个值是加密的方式key
    const encrypts = AES.encrypt(that.loginForm.password,'123456{saltZX}..');
    
    
    let params = {
             username: that.loginForm.username,
             password: encrypts,
      };
   // 到这里在用户提交登录的时候把params提交过去就好啦！

   我们再来看看具体效果：

   {

4. password: "yktfmgc8jZ2OjmjHNvp75g=="
5. username: "admin"