前端项目中使用aes加密解密-对称加密
本文介绍的rsa加解密方法,适合react,vue,angular框架的前端项目
1. 安装cryto-js:npm install crypto-js
2. rsa加密解密函数:(cbc模式,base64格式,zeroPadding,16位)
1 import CryptoJS from 'crypto-js/crypto-js' 2 3 // 默认的 KEY 与 iv 如果没有给 4 const KEY = CryptoJS.enc.Utf8.parse("1234567890123456"); 5 const IV = CryptoJS.enc.Utf8.parse('1234567890123456'); 6 /** 7 * AES加密 :字符串 key iv 返回base64 8 */ 9 export function Encrypt(word, keyStr, ivStr) { 10 let key = KEY 11 let iv = IV 12 13 if (keyStr) { 14 key = CryptoJS.enc.Utf8.parse(keyStr); 15 iv = CryptoJS.enc.Utf8.parse(ivStr); 16 } 17 18 let srcs = CryptoJS.enc.Utf8.parse(word); 19 var encrypted = CryptoJS.AES.encrypt(srcs, key, { 20 iv: iv, 21 mode: CryptoJS.mode.CBC, 22 padding: CryptoJS.pad.ZeroPadding 23 }); 24 // console.log("-=-=-=-", encrypted.ciphertext) 25 return CryptoJS.enc.Base64.stringify(encrypted.ciphertext); 26 27 } 28 /** 29 * AES 解密 :字符串 key iv 返回base64 30 * 31 */ 32 export function Decrypt(word, keyStr, ivStr) { 33 let key = KEY 34 let iv = IV 35 36 if (keyStr) { 37 key = CryptoJS.enc.Utf8.parse(keyStr); 38 iv = CryptoJS.enc.Utf8.parse(ivStr); 39 } 40 41 let base64 = CryptoJS.enc.Base64.parse(word); 42 let src = CryptoJS.enc.Base64.stringify(base64); 43 44 var decrypt = CryptoJS.AES.decrypt(src, key, { 45 iv: iv, 46 mode: CryptoJS.mode.CBC, 47 padding: CryptoJS.pad.ZeroPadding 48 }); 49 50 var decryptedStr = decrypt.toString(CryptoJS.enc.Utf8); 51 return decryptedStr.toString(); 52 }
3. 在组件中使用:
1 import {Decrypt, Encrypt} from '刚刚封装的js' 2 3 var parm1 = Decrypt('加密的字段', key, iv) 4 console.log('加密之后的字段:', parm1) 5 6 var parm2 = Decrypt('解密的字段', key, iv) 7 console.log('解密之后的字段:', parm2)
备注:密钥最好是数字,不然可能会报错(报代码的错误,其实代码没问题)