前端数据的加密和解密-尊龙游戏旗舰厅官网

作为一个前端菜鸡,今天碰到一个加密解密的坑,浪费了不少时间. 为了报仇,我决定再次拿起我的小本本,君子报仇十年不晚,先记下来.

先说坑,加密解密前端工作中很常见. 之前也加密过密码账户之类的,一切都顺畅无比,比如:

//vue中mounted: function() {let x = encryptdes("123", this.$enkey);//加密let x2 = decryptdes(x, this.$enkey); //解密console.log(x); console.log(x2); }

输出结果:(看吧一切都那么顺利)

 

就在今天当我加密要一个"对象"的时候......出现了问题:

 

let obj = {test: 123};console.log(json.stringify(obj));let x = encryptdes(json.stringify(obj), this.$enkey);let x2 = decryptdes(x, this.$enkey);console.log(x);console.log(x2);

 结果输出了个这么个鬼东西:

 

 这不科学啊,由于菜鸡是真的菜,导致我根本没见过这鬼东西,百度完了,丝毫没有线索,菜鸡我开始怀疑人生,突然灵光一现,难道就因为菜鸡我没"对象" ? obj=null了?

问了哈旁边后台的一个同事.说应该字符串的编码之类的问题 ,结果再用url解码解了下真的有结果:(js中对url进行转码与解码)

let obj = {test: 123};console.log(json.stringify(obj));let x = encryptdes(json.stringify(obj), this.$enkey);let x2 = decryptdes(x, this.$enkey);console.log(x);console.log(x2);console.log(unescape(x2));

果然不是obj=null的事.

附加密的封装:

import cryptojs from "crypto-js";function stringtohex(str){var val="";for(var i = 0; i < str.length; i ){if(val == "")val = str.charcodeat(i).tostring(16);elseval = "," str.charcodeat(i).tostring(16);}return val;}//base64加密 export const encryptbase64 = (message)=>{var str = cryptojs.enc.utf8.parse(message);var encryptmsg = cryptojs.enc.base64.stringify(str);return encryptmsg }//base64解密 export const decryptbase64 = (message)=>{var decryptmsg = cryptojs.enc.base64.parse(message);var parsestr = decryptmsg.tostring(cryptojs.enc.utf8);return parsestr }// des加密密 export const encryptdes = (message, key) => {message = encodeuricomponent(message)key = encodeuricomponent(key)var keyhex = cryptojs.enc.utf8.parse(key)var ivhex = cryptojs.enc.utf8.parse(key)var option = {iv: ivhex, mode: cryptojs.mode.cbc, padding: cryptojs.pad.pkcs7}var encrypted = cryptojs.des.encrypt(message, keyhex, option)var msg = (encrypted.ciphertext.tostring())var b=msg.touppercase();return (b) }// des解密 export const decryptdes = (message, key) => {var keyhex = cryptojs.enc.utf8.parse(key)var ivhex = cryptojs.enc.utf8.parse(key)var decrypted = cryptojs.des.decrypt({ciphertext: cryptojs.enc.hex.parse(message)},keyhex,{iv: ivhex,mode: cryptojs.mode.cbc,padding: cryptojs.pad.pkcs7})return decrypted.tostring(cryptojs.enc.utf8) }

 

总结

以上是尊龙游戏旗舰厅官网为你收集整理的前端数据的加密和解密--对象解密的坑的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得尊龙游戏旗舰厅官网网站内容还不错，欢迎将尊龙游戏旗舰厅官网推荐给好友。