javascript - 逐字节读取文件并解析为 int

Question

我必须从文件中读取数据。该数据由服务器逐字节写入文件。文件结构固定，现在想用JS读取里面的信息。

我找到了 http://www.html5rocks.com/en/tutorials/file/dndfiles/并将其复制到 fiddle 中:http://jsfiddle.net/egLof4ph/

function readBlob(opt_startByte, opt_stopByte) {

    var files = document.getElementById('files').files;
    if (!files.length) {
        alert('Please select a file!');
        return;
    }

    var file = files[0];
    var start = parseInt(opt_startByte) || 0;
    var stop = parseInt(opt_stopByte) || file.size - 1;

    var reader = new FileReader();

    // If we use onloadend, we need to check the readyState.
    reader.onloadend = function(evt) {
        if (evt.target.readyState == FileReader.DONE) { // DONE == 2
            document.getElementById('byte_content').textContent = evt.target.result;
            document.getElementById('byte_range').textContent = ['Read bytes: ', start + 1, ' - ', stop + 1,
                ' of ', file.size, ' byte file'].join('');
        }
    };

    var blob = file.slice(start, stop);

var a = reader.readAsBinaryString(blob);

}

document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {
    if (evt.target.tagName.toLowerCase() == 'button') {
        var startByte = evt.target.getAttribute('data-startbyte');
        var endByte = evt.target.getAttribute('data-endbyte');
        readBlob(startByte, endByte);
    }
}, false);

我知道前 7 个字节是垃圾，可以扔掉。接下来的 68Bytes 属于一起，每个值都是 4bytes 大。在 68Bytes 之后又是 68 个可用字节(这 68bytes 是“时隙”)。

我的问题:当我使用该代码时，我得到许多符号(A、Q、&&&、特殊字符，..)，但数据实际上是多头。我怎样才能将它们解析成数字？根据 Filereader API readAsBinarsString() 返回原始二进制数据。以及如何正确解析整个文件？

所以，原始文件看起来像这样:

    <7B>Metadata</7B><4B>long value</4B>....17times for each timeslot      <4B>long value</4B>....17times again.... and this util the end of the file.

当我使用上面的代码时，我得到如下输出:�&�&WK�

此外我还发现:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays (因为 FileReader 提供了一个返回 ArrayBuffer 的方法)，所以我想我应该使用 readAsArrayBuffer()，但如何使用它来获取我的数据？

Answer 1

你真的需要二进制文件吗？

请注意，根据 W3C 2012 年 7 月 12 日的工作草案，readAsBinaryString 方法现已弃用。

function readBlob(opt_startByte, opt_stopByte) {

    var files = document.getElementById('files').files;
    if (!files.length) {
      alert('Please select a file!');
      return;
    }

    var file = files[0];
    var start = parseInt(opt_startByte) || 0;
    var stop = parseInt(opt_stopByte) || file.size - 1;

    var reader = new FileReader();
    reader.onloadend = function (evt) {

      if (evt.target.readyState == FileReader.DONE) { // DONE == 2
        var a = new Uint8Array(evt.target.result)
        var binary = ""
        for (var i =0; i <= a.length; i++) {
          binary += Number(a[i]).toString(2)
        }
        document.getElementById('byte_content').textContent = binary;
        document.getElementById('byte_range').textContent = ['Read bytes: ', start + 1, ' - ', stop + 1,
          ' of ', file.size, ' byte file'].join('');
      }
    };;


    var blob = file.slice(start, stop);
    var a = reader.readAsArrayBuffer(blob)
  }

  document.querySelector('.readBytesButtons').addEventListener('click', function (evt) {
    if (evt.target.tagName.toLowerCase() == 'button') {
      var startByte = evt.target.getAttribute('data-startbyte');
      var endByte = evt.target.getAttribute('data-endbyte');
      readBlob(startByte, endByte);
    }
  }, false);