Question

我定义了一个值为[0,1,2,3]的简单Uint8Array。然后我使用这个二进制数据创建了一个Blob对象，并使用readAsArrayBuffer方法从fileReader读取。但是当我从blob获得值时，它包含[48,49,50,51]，而不是[0,1,2,3]！

这是源代码：

var bin = new Uint8Array(4);
bin[0] = 0;
bin[1] = 1;
bin[2] = 2;
bin[3] = 3;
console.log(bin);    // [0,1,2,3]

var blob = new Blob(bin);

var fileReader = new FileReader();
fileReader.onload = function() {
    var buffer = fileReader.result;
    var dv = new DataView(buffer);
    console.log(new Uint8Array(buffer));    // [49,50,51,52]

    var dv = new DataView(buffer);
    console.log([
        dv.getUint8(0),
        dv.getUint8(1),
        dv.getUint8(2),
        dv.getUint8(3)
    ]);    // it also prints [49,50,51,52]
    };
};

fileReader.readAsArrayBuffer(blob);

为什么会这样？我写了0,1,2,3但是每个值都增加了48个。有没有我错过的东西？

Answer 1

Blob constructor takes an array of arrays。现在你正在传递一个Uint8Array，它试图转换为文本。（你可以看到字符49,50,51,51转换为1,2,3和4的文本/ ASCII表示。）

要更正，只需更改此行以在数组中嵌入bin - 尽管类型化数组在技术上是一个数组，但无论数据是什么，它都需要一个常规数组来保存/引用各种数据：

var blob = new Blob([bin]);

我建议使用mime-type，但在这种情况下并不需要。

var bin = new Uint8Array(4);
bin[0] = 0;
bin[1] = 1;
bin[2] = 2;
bin[3] = 3;
console.log(bin);    // [0,1,2,3]

var blob = new Blob([bin]);  // !! <- make sure this is passed an array

var fileReader = new FileReader();
fileReader.onload = function() {
    var buffer = fileReader.result;
    var dv = new DataView(buffer);
    console.log(new Uint8Array(buffer));

    var dv = new DataView(buffer);
    console.log([
        dv.getUint8(0),
        dv.getUint8(1),
        dv.getUint8(2),
        dv.getUint8(3)
    ]);
};

fileReader.readAsArrayBuffer(blob);

从Blob读取ArrayBuffer有错误的数据

1 个答案: