crypto-js对称加密解密的使用方式详解(vue与java端)
更新时间:2025年01月08日 11:17:28 作者:八月林城
这篇文章主要介绍了如何在Vue前端和Java后端使用crypto-js库进行AES加密和解密,前端通过创建AES.js文件来实现加密解密功能,并在Vue文件或JavaScript中使用,后端则可以直接使用Java代码进行AES加密和解密操作,需要的朋友可以参考下
一、vue前端
1.1、安装crypto-js
npm install crypto-js
1.2、创建加密解密jsAES.js
import CryptoJS from 'crypto-js'
/**
* AES加密处理(CBC模式)
*/
export function encryptCBC(word, keyStr, ivStr) {
// 16位数随机码
keyStr = keyStr ? keyStr : "Ej7SdjOBvlv2PubN";
ivStr = ivStr ? ivStr : "Ej7SdjOBvlv2PubN";
let key = CryptoJS.enc.Utf8.parse(keyStr);
let iv = CryptoJS.enc.Utf8.parse(ivStr);
var encryptedData = CryptoJS.AES.encrypt(word, key,
{
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
}
);
return encryptedData.toString();
}
/**
* AES解密处理(CBC模式)
*/
export function decryptCBC(word, keyStr, ivStr) {
word = (word + '').replace(/\n*$/g, '').replace(/\n/g, ''); // 这一行,将换行符替换为空
// 密钥
keyStr = keyStr ? keyStr : "Ej7SdjOBvlv2PubN";
// 向量
ivStr = ivStr ? ivStr : "Ej7SdjOBvlv2PubN";
var key = CryptoJS.enc.Utf8.parse(keyStr);
let iv = CryptoJS.enc.Utf8.parse(ivStr);
var decrypt = CryptoJS.AES.decrypt(word, key,
{
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
}
)
return decrypt.toString(CryptoJS.enc.Utf8)
}
1.3、使用(vue文件或者js中)
import { encryptCBC } from '@/js/util/AES'
export function test1(){
var a1 = encryptCBC("张三");
console.log('加密后的数据:',a1 )
}
二、java后端的使用方式
import org.bouncycastle.jce.provider.BouncyCastleProvider;
import javax.crypto.Cipher;
import javax.crypto.spec.IvParameterSpec;
import javax.crypto.spec.SecretKeySpec;
import java.security.Security;
import java.util.Base64;
public class AESUtil {
// AES密钥算法
private static final String KEY_ALGORITHM = "AES";
// 加密/解密算法/工作模式/填充方式
private static final String CIPHER_ALGORITHM = "AES/CBC/PKCS5Padding";
private static final String KEY="Ej7SdjOBvlv2PubN";
//CBC加密偏移量
private static final String IVCODE="Ej7SdjOBvlv2PubN";
/**
* AES加密
*/
public static String encrypt(String data) {
try {
Security.addProvider(new BouncyCastleProvider());
SecretKeySpec secretKeySpec = new SecretKeySpec(KEY.getBytes(), KEY_ALGORITHM);
Cipher cipher = Cipher.getInstance(CIPHER_ALGORITHM, "BC");
IvParameterSpec iv = new IvParameterSpec(IVCODE.getBytes());
cipher.init(Cipher.ENCRYPT_MODE, secretKeySpec,iv);
byte[] encryptedBytes = cipher.doFinal(data.getBytes());
return Base64.getEncoder().encodeToString(encryptedBytes);
} catch (Exception e) {
e.printStackTrace();
return null;
}
}
/**
* AES解密
*/
public static String decrypt(String encryptedData) {
try {
SecretKeySpec secretKeySpec = new SecretKeySpec(KEY.getBytes(), KEY_ALGORITHM);
IvParameterSpec iv = new IvParameterSpec(IVCODE.getBytes());
Security.addProvider(new BouncyCastleProvider());
byte[] encryptedBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(encryptedData);
Cipher cipher = Cipher.getInstance(CIPHER_ALGORITHM, "BC");
cipher.init(Cipher.DECRYPT_MODE, secretKeySpec, iv);
byte[] decryptedBytes = cipher.doFinal(encryptedBytes);
return new String(decryptedBytes);
} catch (Exception e) {
e.printStackTrace();
return null;
}
}
// 验证
public static void main(String[] args) throws Exception {
String data = "张三";
String encryptedData = encrypt(data); // 加密数据
String decryptedData = decrypt(encryptedData); // 解密数据
System.out.println("加密后的数据: " + encryptedData);
System.out.println("解密后的数据: " + decryptedData);
}
}总结
到此这篇关于crypto-js对称加密解密使用方式(vue与java端)的文章就介绍到这了,更多相关crypto-js对称加密解密使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
vue3 + element-plus 的 upload + axios + django 实现文件上
这篇文章主要介绍了vue3 + element-plus 的 upload + axios + django 文件上传并保存,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2024-01-01
Vue框架+Element-ui(el-upload组件)使用http-request方法上传文件并显示文件上传进度功能
这篇文章主要介绍了Vue框架+Element-ui(el-upload组件)使用http-request方法上传文件并显示文件上传进度功能,本通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧2024-08-08
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
这篇文章主要介绍了Vue中Table组件行内右键菜单实现方法,该项目是基于 vue + AntDesign的,具体实例代码给大家介绍的非常详细 ,需要的朋友可以参考下2019-11-11
vue清除浏览器全部cookie的问题及解决方法(绝对有效!)
最近项目要实现关闭浏览器清除用户缓存的功能,下面这篇文章主要给大家介绍了关于vue清除浏览器全部cookie的问题及解决方法,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-06-06


最新评论