vue crypto-js 数据加密与解密
vue使用crypto-js进行数据的加密与解密与后端对内容的加解密
·
vue 使用crypto-js加密与解密、后端加密与解密工具类
crypto-js介绍
CryptoJS是一个JavaScript的加解密的工具包。支持多种的算法:MD5、SHA1、SHA2、SHA3、RIPEMD-160 哈希散列,进行 AES、DES、Rabbit、RC4、Triple DES 加解密。具体内容与用法可阅读文档了解。
码云网址
crypto-js文档
vue安装crypto-js
npm install crypto-js
或
yarn add crypto-js
前端封装加解密
新建js文件crypto.js并放入src目录下,如
工具类文件内容
import CryptoJS from "crypto-js";
// 后端进行加密解密时,keyStr与IvStr需要和后端保持一致
const defaultKeyStr = "smLeGV63judEcxKU";
const defaultIvStr = "lFbGSVuAmZqtPCLa";
const defaultKey = CryptoJS.enc.Utf8.parse(defaultKeyStr);
const defaultIv = CryptoJS.enc.Utf8.parse(defaultIvStr);
export default {
/**
* 获取key
* @param keyStr key字符串
*/
getKey(keyStr) {
if (keyStr) {
return CryptoJS.enc.Utf8.parse(keyStr);
}
return defaultKey;
},
/**
* 获取iv
* @param ivStr iv字符串
* @returns {*}
*/
getIv(ivStr) {
if (ivStr) {
return CryptoJS.enc.Utf8.parse(ivStr);
}
return defaultIv;
},
/**
* 加密
* @param {*} word 加密前字符串
* @param {*} keyStr key
* @param {*} ivStr iv
* @return 加密后内容
*/
encrypt(word, keyStr, ivStr) {
let key = this.getKey(keyStr);
let iv = this.getIv(ivStr);
let srcs = CryptoJS.enc.Utf8.parse(word);
let encrypted = CryptoJS.AES.encrypt(srcs, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.ZeroPadding
});
return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
},
/**
* 解密
* @param {*} word 已加密字符串
* @param {*} keyStr key
* @param {*} ivStr iv
* @return 解密结果
*/
decrypt(word, keyStr, ivStr) {
let key = this.getKey(keyStr);
let iv = this.getIv(ivStr);
let base64 = CryptoJS.enc.Base64.parse(word);
let src = CryptoJS.enc.Base64.stringify(base64);
let decrypt = CryptoJS.AES.decrypt(src, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.ZeroPadding
});
let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
return decryptedStr.toString();
}
}
后端对应加密解密工具类
pom文件引入包
<dependency>
<groupId>org.bouncycastle</groupId>
<artifactId>bcprov-jdk15on</artifactId>
<version>1.60</version>
</dependency>
加解密工具类
package com.ljc.base.common.base.utils;
import lombok.extern.slf4j.Slf4j;
import org.apache.tomcat.util.codec.binary.Base64;
import javax.crypto.Cipher;
import javax.crypto.spec.IvParameterSpec;
import javax.crypto.spec.SecretKeySpec;
/**
* @author ljc
* @version 1.0
* @date 2023/1/25 16:27
*/
@Slf4j
public class CryptoUtil {
/***
* key和iv值需要和前端一致
*/
public static final String KEY = "smLeGV63judEcxKU";
public static final String IV = "lFbGSVuAmZqtPCLa";
private CryptoUtil() {
}
/**
* 加密方法
*
* @param data 要加密的数据
* @param key 加密key
* @param iv 加密iv
* @return 加密的结果(加密失败返回null)
*/
public static String encrypt(String data, String key, String iv) {
try {
//"算法/模式/补码方式"NoPadding PkcsPadding
Cipher cipher = Cipher.getInstance("AES/CBC/NoPadding");
int blockSize = cipher.getBlockSize();
byte[] dataBytes = data.getBytes();
int plaintextLength = dataBytes.length;
if (plaintextLength % blockSize != 0) {
plaintextLength = plaintextLength + (blockSize - (plaintextLength % blockSize));
}
byte[] plaintext = new byte[plaintextLength];
System.arraycopy(dataBytes, 0, plaintext, 0, dataBytes.length);
cipher.init(Cipher.ENCRYPT_MODE, new SecretKeySpec(key.getBytes(), "AES"), new IvParameterSpec(iv.getBytes()));
byte[] encrypted = cipher.doFinal(plaintext);
return new Base64().encodeToString(encrypted);
} catch (Exception e) {
log.error("加密异常", e);
return null;
}
}
/**
* 解密方法
*
* @param data 要解密的数据
* @param key 解密key
* @param iv 解密iv
* @return 解密的结果(解密失败返回原始值)
*/
public static String desEncrypt(String data, String key, String iv) {
try {
byte[] encrypted = new Base64().decode(data);
Cipher cipher = Cipher.getInstance("AES/CBC/NoPadding");
cipher.init(Cipher.DECRYPT_MODE, new SecretKeySpec(key.getBytes(), "AES"), new IvParameterSpec(iv.getBytes()));
byte[] original = cipher.doFinal(encrypted);
return new String(original).trim();
} catch (Exception e) {
log.error("解密异常", e);
return data;
}
}
}
工具类的使用
前端加密,先在文件中导入工具类文件后进行使用
// 导入加密工具类
import crypto from "../../utils/crypto";
// 使用
let password = crypto.encrypt(this.loginForm.password);
后端解密
password = CryptoUtil.desEncrypt(password, CryptoUtil.KEY,CryptoUtil.IV);
更多推荐
已为社区贡献5条内容
所有评论(0)