前端加密

前端加密步骤

1. 安装crypto-js插件

npm install crypto-js

2. 新建src/utils/aes.js文件

import CryptoJS from 'crypto-js'
export default {
  //加密
  encrypt(word, keyStr){ 
    keyStr = keyStr ? keyStr : 'zaqxswcde123vfr4';
    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 : 'zaqxswcde123vfr4';
    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();
  }

}

温馨提示：

• encrypt(word, keyStr) 加密方法
• decrypt(word, keyStr) 解密方法
• 其中keyStr为解密使用的字符串。

3. 挂载方法到Vue实例上

import $aes from '../src/utils/aes'
Vue.prototype.$aes = $aes

4. 使用指导

• 加密 this.$aes.encrypt(str)
• 解密 this.$aes.decrypt(str)

5. 使用场景

• 前端缓存信息的加密保护；
• 页面链接参数的解密保护；