<!DOCTYPE html>
<html>
<head>
<title>aes demo</title>
<meta charset="utf-8"/>
<style>
*{margin:0;padding:0}
.demo-wrap{width: 400px;height: 50px;margin: 50px auto auto auto}
</style>
<script src="./rollups/aes.js"></script>
<!-- <script src="./components/pad-zeropadding.js"></script>-->
</head>
<body>
<div class="demo-wrap">
<input type="text" id="data-ipt"/>
<button onclick="getAES();">AES加密</button>
<button onclick="getDAes();">AES解密</button>
<br/>
加密后的数据:
<p id = "encrypted"></p>
解密后的数据:
<p id="decrypted"></p>
</div>
<script>
function getAesString(data,key,iv){//加密
var key = CryptoJS.enc.Hex.parse(key);
var iv = CryptoJS.enc.Latin1.parse(iv);
var encrypted = CryptoJS.AES.encrypt(data,key,
{
iv:iv,
mode:CryptoJS.mode.CBC,
padding:CryptoJS.pad.Pkcs7
});
return encrypted;
}
function getDAesString(encrypted,key,iv){//解密
var key = CryptoJS.enc.Hex.parse(key);
var iv = CryptoJS.enc.Latin1.parse(iv);
var decrypted = CryptoJS.AES.decrypt(encrypted,key,
{
iv:iv,
mode:CryptoJS.mode.CBC,
padding:CryptoJS.pad.Pkcs7
});
return decrypted.toString(CryptoJS.enc.Utf8);
}
function getAES(){ //加密
var data = document.getElementById("data-ipt").value;//明文
var key = '1234567812345678'; //密钥
var iv = 'Pkcs7';
var encrypted = getAesString(data,key,iv); //密文
document.getElementById("encrypted").innerHTML = encrypted;
}
function getDAes(){//解密
var encrypted = document.getElementById("encrypted").innerHTML; //密文
var key = '1234567812345678';
var iv = 'Pkcs7';
var decryptedStr = getDAesString(encrypted,key,iv);
document.getElementById("decrypted").innerHTML = decryptedStr;
}
</script>
</body>
</html>
原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/8763.html