關於Javascript的des加密

Thinkguo發表於2018-07-03
JavaScript加密

參考文章：https://www.cnblogs.com/MSMXQ/p/4484348.html

需要先下載CryptoJS檔案，然後引入其中的兩個檔案，可以在github中找到。

直接上程式碼

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>JS設定DES加密處理</title>
        <script type="text/javascript" src="js/jquery.min.js"></script>
        <script src="js/rollups/tripledes.js"></script>
        <script src="js/components/mode-ecb.js"></script>
        <script>
             //DES 解密 加密
            function encryptByDES(message, key) {
                    var keyHex = CryptoJS.enc.Utf8.parse(key);
                    var encrypted = CryptoJS.DES.encrypt(message, keyHex, {
                        mode: CryptoJS.mode.ECB,
                        padding: CryptoJS.pad.Pkcs7
                    });
                    return encrypted.toString();
                }
                //DES 解密

            function decryptByDES(ciphertext, key) {
                var keyHex = CryptoJS.enc.Utf8.parse(key);
                // direct decrypt ciphertext
                var decrypted = CryptoJS.DES.decrypt({
                    ciphertext: CryptoJS.enc.Base64.parse(ciphertext)
                }, keyHex, {
                    mode: CryptoJS.mode.ECB,
                    padding: CryptoJS.pad.Pkcs7
                });
                return decrypted.toString(CryptoJS.enc.Utf8);
            }
        </script>
        <script>
             //加密
            function encryptStr() {
                    var strKey = $.trim($(`#key`).val());
                    var strMsg = $.trim($(`#text1`).val());
                    $(`#text2`).val(encryptByDES(strMsg, strKey));
                }
                //解密

            function decryptStr() {
                var strKey = $.trim($(`#key`).val());
                var ciphertext = $.trim($(`#text2`).val());
                $(`#text3`).val(decryptByDES(ciphertext, strKey));
            }
        </script>
    </head>

    <body>
        <h1>JS設定DES加密處理</h1>
        <label>key</label>
        <input type="text" value=`12345678` id="key" />
        <div>
            <textarea id="text1" placeholder="請輸入需要加密的字元"></textarea>
            <input type="button" value="加密" onclick="encryptStr();" />
            <textarea id="text2"></textarea>
            <input type="button" value="解密" onclick="decryptStr();" />
            <textarea id="text3"></textarea>
        </div>
    </body>
</html>

相關文章