前端使用DES-进行加密和解密

1.安装 CryptoJS，npm install crypto-js --save

2.创建一个文件夹des.js

import CryptoJS from 'crypto-js';
// DES加密
export const encryptByDES = (message, key) => {
var keyHex = CryptoJS.enc.Utf8.parse(key);
var encrypted = CryptoJS.DES.encrypt(message, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
return encrypted.toString();
}

// DES解密
export const decryptByDES = (ciphertext, key) => {
var keyHex = CryptoJS.enc.Utf8.parse(key);
// direct decrypt ciphertext
var decrypted = CryptoJS.DES.decrypt({
ciphertext: CryptoJS.enc.Base64.parse(ciphertext)
}, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
return decrypted.toString(CryptoJS.enc.Utf8);
}

3.在需要使用的文件内引入

import { encryptByDES, decryptByDES } from "@/des/des.js"

var myKey = 'sma******23456'; // 密钥

// 加密

var username = 'admin'

var password = 'Sj****999'

username = encryptByDES(usename,myKey) // 加密后 d0EER4mD8LCCuBHTALqdrg==

password = encryptByDES(password,myKey) // 加密后 xfPsV+XCdqsJqIc38qJ0ug==

// 解密

username = decryptByDES(usename,myKey)

password = decryptByDES(password,myKey)

遇到的问题：URL编码问题，如果不对URL进行编码直接加密，那么在解码时，如果字符串存在“+”这种特殊符号，在解码时会出它替换成“ ”，此时在解密就会无法解开，导致错误的结果

即加密后，进行URL编码，然后到另一页面后，进行URL解码，再解密，结果是失败

解决方法1：对%20进行替换成+，这个只针对某个字符

password = decodeURIComponent(password.replace(/%20/g, '+'))

解决方:2：先对字符进行URL编码,再加密，这时不会出现+号等字符，然后到另一页面后，再解密，然后再解码即可。（编码加密解密解码）

针对后端进行加密前端解密的情况：需要后端加密完后再进行编码前端在解密

前端代码：

username = decryptByDES(this.$route.query.username,myKey)

password = decryptByDES(this.$route.query.password,myKey)

前端使用DES-进行加密和解密

猜你喜欢