javascript - 使用 CryptoJS 解密图片并将其插入页面

Question

出于一系列复杂的原因。我们需要以加密状态通过网络发送图像，并在另一端使用 AES 对其进行解密。在服务器端，发生的情况如下:

openssl aes-256-cbc -in pup.jpg -out pup.jpg.enc
base64 pup.jpg.enc > pup.jpg.enc.b64

在客户端，这是我们正在使用的 JavaScript:

<img id="picture"/>
<script>
    var picture = document.getElementById("picture");
    var data = new XMLHttpRequest();
    data.open('GET', 'http://server.com/pup.jpg.enc.b64', true);
    data.onreadystatechange = function(){
        if(this.readyState == 4 && this.status==200){
            var dec = CryptoJS.AES.decrypt(data.responseText, "password");
            var plain = CryptoJS.enc.Base64.stringify( dec );
        picture.src = "data:image/jpeg;base64,"+plain;
        }
    };
    data.send(null);
</script>

我的输入和输出出现偏差，我一生都无法弄清楚为什么。这是输入和输出:

In:  /9j/4RLKRXhpZgAATU0AKgAAAAgADAEAAAMAAAABBADJx...
Out: /9j/4RLKRXhpZgAATU0AKgAAAAgADAEAAAMAAAABBAAAA...
                                               ^-- deviation

我是否必须向 CryptoJS 指定我正在使用 256 位加密？

Answer 1

问题似乎是 CryptoJS 中的一个错误，如果输入字符串包含新行，该错误会导致库无法工作。像这样对文件进行编码:

openssl enc -aes-256-cbc -in pup.jpg -pass pass:"password" | base64 | tr -d '\n' > pup.enc

解决了这个问题。问题出在 javascript 上，但出在编码上。好吧，对于 javascript，因为 cryptojs 中有一个错误:https://code.google.com/p/crypto-js/issues/detail?id=38