CryptoJS AES加密、解密练习demo

2019PHP高薪工程师学习路线图....>>>

<!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>