vue中 使用AES進行前端加密解密

因為項目中涉及到字符串的加密解密，這個過程是后台全權處理，但是我覺得前端加密解密更加靈活，這里記錄下AES前端加密解密的方法

安裝crypto-js： npm install crypto-js --save-dev

//utils.js

//首先聲明兩個變量，加密的時候要用到，要和后台溝通，保持一致
const AES_KEY = '0D7FB71E8EC31E97';
const IV = 'TRYTOCN394402133';

/**
     * 接口數據加密函數
     * @param key string 加密key(16位)
     * @param iv string 加密向量(16位)
     */

function encrypt(params) { var key = CryptoJS.enc.Utf8.parse(AES_KEY); var iv = CryptoJS.enc.Utf8.parse(IV); var jsonData = JSON.stringify(params); //下面的data參數要求是一個字符串，第一次用的時候我直接傳遞的是一個對象，出現了錯誤，要轉換成字符串 var data = CryptoJS.enc.Utf8.parse(jsonData); var encrypted = CryptoJS.AES.encrypt(data, key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 }).toString(); return encrypted; }
/**
*@param key string 加密key(16位)
*@param iv string 加密向量(16位)
*
**/

//解密 function decrypt(word){ var key = CryptoJS.enc.Utf8.parse("這里填解密的key（與加密key一樣）"); var decrypt = CryptoJS.AES.decrypt(word, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}); return CryptoJS.enc.Utf8.stringify(decrypt).toString(); } export default { encrypt,decrypt }

//文件用處引入utils.js import Utils from "./utils.js";
eg：

Utils.encrypt("hello world") ；

Utils.decrypt('58vDC+ceIjxMub/lIKSAjYqHaZThH4xGyTW4gZxFJk265T7umRVGm/YcAABPbQZ/')//加密后的hello world