Question

我需要使用对Web服务的AJAX请求将大量16位整数传输到客户端。该阵列本质上是具有一些额外元数据的图像的灰度像素数据。

原始图片采用浏览器不支持的专有格式。典型的图像是2000px x 4000px，因此阵列可以包含8,000,000 + 16位值。

是否可以制作一个AJAX请求并在一个响应中返回整个数组，还是应该分成更小的块并单独请求每个？如果在一个响应中传输整个数组是公认的做法，我是否必须在请求期间处理不可靠的连接（或者在浏览器中“开箱即用”）？

我们正在编写客户端和Web服务，因此我们对方法完全灵活。

Answer 1

与其他人提到的一样，如果在服务器中启用gzip压缩传输，浏览器应自动解压缩图像。如果图像是具有大面积相同颜色的扫描文档，则实际上可以压缩图像;如果它更像航拍照片那么多。

既然您在客户端拥有该图像，那么您还有另一个问题：如何处理这800万个16位像素。

在我们输入数组之前，我们必须使用字符串来表示任意数据。这比听起来更安全，因为在JavaScript字符串中是16位代码单元的序列，可能被解释为以UTF-16编码的文本。对于编码无效的字符串，JavaScript完全没有问题。

这意味着您可以将图像存储为一个长字符串，并使用charCodeAt访问各个像素。对于大多数操作目的而言，这应该相当快。

这是一个将16位二进制数据（实际上是PNG图标）加载到字符串并输出前16个元素的示例：

$.ajax({
    url:"http://fiddle.jshell.net/favicon.png",
    success: function(data) {
        // Now we have the data, let's show it:
        var out = "";
        for (var i = 0; i < 16; i++) {
            out += ","+data.charCodeAt(i).toString(16);
        }
        console.log(out.substring(1));
    },
    beforeSend: function ( xhr ) {
        xhr.overrideMimeType("text/plain; charset=utf-16be");
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.log("ERROR: "+textStatus+" "+errorThrown);
        console.log(jqXHR);
    },
})

（jsfiddle的实例）

Answer 2

您需要传输的数据大小超过16 MB，但考虑到您正在处理未归档数据这一事实，您应该使用gzip来缩小规模。您还应该考虑一种非常快速的序列化格式（因为您需要在客户端和服务器上进行大量处理才能序列化/反序列化数据）。

将大型阵列传输到客户端

2 个答案: