前端Vue 3.4代码示例：
<template>
<div>
<input v-model="data" placeholder="请输入数据" />
<button @click="encryptData">加密数据</button>
<button @click="decryptData">解密数据</button>
<p>加密结果: {{ encryptedData }}</p>
<p>解密结果: {{ decryptedData }}</p>
</div>
</template>
<script>
import CryptoJS from 'crypto-js'
export default {
data() {
return {
data: '',
encryptedData: '',
decryptedData: ''
}
},
methods: {
encryptData() {
// 假设'secretKey'是从后端获取的密钥
const secretKey = 'your-secret-key'
this.encryptedData = CryptoJS.AES.encrypt(this.data, secretKey).toString()
},
decryptData() {
// 假设'secretKey'是从后端获取的密钥
const secretKey = 'your-secret-key'
try {
const bytes = CryptoJS.AES.decrypt(this.encryptedData, secretKey)
this.decryptedData = bytes.toString(CryptoJS.enc.Utf8)
} catch (e) {
console.error('无法解密数据')
}
}
}
}
</script>
后端Spring Boot 2.7.18代码示例：
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RestController;
import javax.crypto.Cipher;
import javax.crypto.spec.SecretKeySpec;
import java.nio.charset.StandardCharsets;
import java.util.Base64;
@RestController
public class EncryptionController {
private static final String SECRET_KEY = "your-secret-key"; // 密钥应该从安全的地方获取
@PostMapping("/encrypt")
public String encrypt(@RequestBody String data) throws Exception {
Cipher cipher = Cipher.getInstance("AES");
cipher.init(Cipher.ENCRYPT_MODE, new SecretKeySpec(SECRET_KEY.getBytes(StandardCharsets.UTF_8), "AES"));
byte[] encryptedBytes = cipher.doFinal(data.getBytes(StandardCharsets.UTF_8));
return Base64.getEncoder().encodeToString(encryptedBytes);
}
@PostMapping("/decrypt")
public String decrypt(@RequestBody String encryptedData) throws Exception {
Cipher cipher = Cipher.getInstance("AES");
cipher.init(Cipher.DECRYPT_MODE, new SecretKeySpec(SECRET_KEY.getBytes(StandardCharsets.UTF_8), "AES"));
byte[] decryptedBytes = cipher.doFinal(Base64.getDecoder().decode(encryptedData));
return new String(decryptedBytes, StandardCharset