前言
不知道大家是不是遇到过公司要求将前端代码加密的,比如最简单的,在发送接口的适合,不想让客户通过f12打开浏览器获取到参数,最简单的方式就是使用crypto-js进行代码加密。
crypto-js安装
封装方法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
| import CryptoJS from "crypto-js" var key = CryptoJS.enc.Utf8.parse("nbhjkj1234567890"); export default { encrypt(data) { var srcs = CryptoJS.enc.Utf8.parse(data); var encrypted = CryptoJS.AES.encrypt(srcs, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 }); return encrypted.toString(); }, decrypt(encrypted) { var decrypted = CryptoJS.AES.decrypt(encrypted, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 }); return CryptoJS.enc.Utf8.stringify(decrypted).toString(); } }
|
简单使用加密参数
1 2 3 4 5 6 7 8 9
| import aec_secret from "@/utils/code"; const params = { keyword: this.searchEntrustValue, agentCode: this.agentCode, }; const codeParams = {}; for (let [key, value] of Object.entries(params)) { codeParams[key] = aec_secret.encrypt(value); }
|
经过上述操作,我们就将请求参数进行了加密
代码混淆
接下来,我们需要把这段加密的代码给混淆了
可以使用
jshaman来混淆代码
比如我们上面的代码经过免费版的混淆之后,就变成了
1
| import _0x5a25af from 'crypto-js'; var key = _0x5a25af['enc']['Utf8']['parse']('nbhjkj1234567890'); export default { 'encrypt'(_0x39cccc) { var _0x1cc1a6 = _0x5a25af['enc']['Utf8']['parse'](_0x39cccc); var _0x304220 = _0x5a25af['AES']['encrypt'](_0x1cc1a6, key, { 'mode': _0x5a25af['mode']['ECB'], 'padding': _0x5a25af['pad']['Pkcs7'] }); return _0x304220['toString'](); }, 'decrypt'(_0xd67352) { var _0x112f8c = _0x5a25af['AES']['decrypt'](_0xd67352, key, { 'mode': _0x5a25af['mode']['ECB'], 'padding': _0x5a25af['pad']['Pkcs7'] }); return _0x5a25af['enc']['Utf8']['stringify'](_0x112f8c)['toString'](); } };
|