前端(vue)用des加密以及解密详细方法

1. 执行npm i crypto-js 下载js包
2. 新建一个js文件夹命名des.js，在js文件中引入crypto-js 即： import cryptoJs from ‘crypto-js’
3. 对加密解密文件进行封装：
4. 
5. 代码如下
   export const encryptDes = (message, key) => {
   var keyHex = cryptoJs.enc.Utf8.parse(key)
   var option = { mode: cryptoJs.mode.ECB, padding: cryptoJs.pad.Pkcs7 }
   var encrypted = cryptoJs.DES.encrypt(message, keyHex, option)
   return encrypted.ciphertext.toString()
   }
6. 
   7.代码如下：
   export const decryptDes = (message, key) => {
   var keyHex = cryptoJs.enc.Utf8.parse(key)
   var decrypted = cryptoJs.DES.decrypt(
   {
   ciphertext: cryptoJs.enc.Hex.parse(message)
   },
   keyHex,
   {
   mode: cryptoJs.mode.ECB,
   padding: cryptoJs.pad.Pkcs7
   }
   )
   return decrypted.toString(cryptoJs.enc.Utf8)
   }
7. 在main.js中引入des.js文件夹 以下是我自己的路径
   import { encryptDes, decryptDes } from ‘./api/des’
8. 将封装的加密和解密函数绑定到vue的原型中
   Vue.prototype.$encryptDes=encryptDes;Vue.prototype.$decryptDes = decryptDes;
9. 在vue的原型链中调取加密解密函数
   加密： this.$encryptDes(需要加密内容,内容的密匙)解密：that.$decryptDes(需要解密内容.内容的密匙)

内容如有修改的地方 请联系本人修改，谢谢