Question

如何使用javascript将UTF-8字符串转换为Latin1编码字符串？

以下是我要做的事情：

我得到一个文件，通过读取为arraybuffer
然后，我将arraybuffer解析为字符串

并使用以下代码将其传递给cryptoJS进行哈希计算：

cryptosha256 = CryptoJS.algo.SHA256.create();
cryptosha256.update(text);
hash = cryptosha256.finalize();

一切都适用于文本文件。使用代码散列非文本文件（image / .wmv文件）时出现问题。我在另一篇博客中看到，CryptoJS作者要求使用Latin1格式而不是UTF-8发送字节，以及我被卡住的地方。

不确定，如何在javascript中使用arraybuffer中的Latin1格式生成字节（或字符串）？

$('#btnHash').click(function () {
    var fr = new FileReader(), 
        file = document.getElementById("fileName").files[0];
    fr.onload = function (e) {
        calcHash(e.target.result, file);
    };
    fr.readAsArrayBuffer(file);
});
function calcHash(dataArray, file) {
    cryptosha256 = CryptoJS.algo.SHA256.create();
    text = CryptoJS.enc.Latin1.parse(dataArray);
    cryptosha256.update(text);
    hash = cryptosha256.finalize();
}

Answer 1

CryptoJS不了解ArrayBuffer是什么，如果你使用像Latin1或UTF-8这样的文本编码，你将不可避免地丢失一些字节。并非每个可能的字节值都具有其中一种文本编码的有效编码。

您必须将ArrayBuffer转换为CryptoJS的内部WordArray，它将字节保存为字数组（32位整数）。我们可以将ArrayBuffer视为无符号8位整数数组，并将它们组合在一起构建WordArray（参见arrayBufferToWordArray）。

以下代码显示了一个完整的示例：

function arrayBufferToWordArray(ab) {
  var i8a = new Uint8Array(ab);
  var a = [];
  for (var i = 0; i < i8a.length; i += 4) {
    a.push(i8a[i] << 24 | i8a[i + 1] << 16 | i8a[i + 2] << 8 | i8a[i + 3]);
  }
  return CryptoJS.lib.WordArray.create(a, i8a.length);
}

function handleFileSelect(evt) {
  var files = evt.target.files; // FileList object

  // Loop through the FileList and render image files as thumbnails.
  for (var i = 0, f; f = files[i]; i++) {
    var reader = new FileReader();

    // Closure to capture the file information.
    reader.onloadend = (function(theFile) {
      return function(e) {
        var arrayBuffer = e.target.result;

        var hash = CryptoJS.SHA256(arrayBufferToWordArray(arrayBuffer));
        var elem = document.getElementById("hashValue");
        elem.value = hash;
      };

    })(f);
    reader.onerror = function(e) {
      console.error(e);
    };

    // Read in the image file as a data URL.
    reader.readAsArrayBuffer(f);
  }
}

document.getElementById('upload').addEventListener('change', handleFileSelect, false);

<script src="https://cdn.rawgit.com/CryptoStore/crypto-js/3.1.2/build/rollups/sha256.js"></script>
<form method="post" enctype="multipart/form-data">
  Select image to upload:
  <input type="file" name="upload" id="upload">
  <input type="text" name="hashValue" id="hashValue">
</form>

您可以使用my other answer中的技术扩展此代码，以便在不冻结浏览器的情况下散列任意大小的文件。

如何使用FileReader读取二进制文件，以便在CryptoJS中使用SHA-256对其进行哈希处理？

1 个答案: