过程不复杂, 只是网上结合后端的AES+SHA1PRNG加解密资料参差不齐, 在此记录下, 方便自己和有需要的小伙伴能够快速找到! 什么原理什么逻辑就不废话了, 直接上代码!
<!DOCTYPE html>
<html>
<head>
<title>aes demo</title>
<meta http-equiv="Content-Type" content="text/html" charset="gbk"/>
<style>
*{margin:0;padding:0}
.demo-wrap{width: 600px;height: 50px;margin: 50px auto auto auto}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
</head>
<body>
<div class="demo-wrap">
<div style="padding: 1rem 0">
<button type="button" onclick="aes_encrypt()">AES加密</button>
<br/>
加密后的数据:<label id="aes_encrypted"></label>
</div>
<div>
<button type="button" onclick="aes_decrypt()">AES解密</button>
<br/>
解密后的数据:<label id="aes_decrypted"></label>
</div>
</div>
<script type="text/javascript">
function aes_encrypt() {
var data = "test";
var key = "自己定";
let realKey = CryptoJS.SHA1(key);
realKey = CryptoJS.SHA1(realKey).toString().substring(0, 32);
let encrypted = CryptoJS.AES.encrypt(data, CryptoJS.enc.Hex.parse(realKey), {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
document.getElementById("aes_encrypted").innerHTML = encrypted.ciphertext.toString(CryptoJS.enc.Base64);
}
function aes_decrypt() {
var data = "oetrAXRN3ya7FmVk8vNeLw==";
var key = "自己定";
let realKey = CryptoJS.SHA1(key);
realKey = CryptoJS.SHA1(realKey).toString().substring(0, 32);
let decrypted = CryptoJS.AES.decrypt(data, CryptoJS.enc.Hex.parse(realKey), {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
document.getElementById("aes_decrypted").innerHTML = decrypted.toString(CryptoJS.enc.Utf8);
}
</script>
</body>
</html>