Uint8ClampedArray替代或使Uint8Array产生一个钳位的字节值字符串

Question

我正在研究这个真正的头颅！

我成功地将字节值添加到Uint8ClampedArray并使用该数组使用此函数生成字节字符串：

this.utf8ArrayToStr = function(array) {
        var s = '';
        for (var i = 0; i < array.length; i++) {
            s += String.fromCharCode(array[i]);
        }
        return s;
};

这可以处理并成功生成正确的字节序列。

问题是并非所有浏览器都支持Uint8ClampedArray，我特别需要它才能在Android浏览器上运行。

我尝试使用标准的Uint8Array，但它会在结果字符串中产生额外的字节值，从而导致错误的行为。

我也在这里找到了一个小垫片，但它没有用，再次产生额外的输出： https ： //gist.github.com/gengkev/2295355

无论如何我可以让Uint8Array充当Uint8ClampedArray，或者更具体地说，在上面的函数中生成字符串时钳位值？

更新：看起来我正在使用标准阵列，但仍有一些混乱的字符导致问题。

Answer 1

我认为你不应该使用Uint8Array来存储你的数据 - 它根本不像Uint8ClampedArray那样工作。 例如：

a = new Uint8Array(1);
b = new Uint8ClampedArray(1);
a[0] = 256;
b[0] = 256;

a[0] === 0;    // true
b[0] === 255;  // true

我只是使用一个常规数组（如果这是一个选项）并在将值存储到它时将值钳位，或者当您读取它们以生成如下所示的字符串时：

s += String.fromCharCode(Math.max(0, Math.min(255, array[i])));

Answer 2

WhatWG推荐使用Uint8ClampedArray来存储画布像素数据。

但是，各种浏览器使用Uint8ClampedArray（或不使用）取决于他们是否实现了WhatWG建议。

因此，更多的跨浏览器解决方案是使用.getImageData从画布中拉出一个数组，然后根据需要操作该数组。 这样你知道你正在使用兼容阵列。

var imageData = context.getImageData(0,0,canvas.width,canvas.height);

var data = imageData.data;  // this array is always compatible with its browser.