XMLHttpRequest使用gzip压缩

Question

使用node.js的请求模块request module，设置请求并正确解压缩来自源的压缩数据非常容易：

var request = require('request');
var requestOptions = {
    url: 'http://whatever.com/getDataWithCompression',
    gzip: true  // <--- this is all that is required
};
request(
    requestOptions,
    function (error, response, data) {
        // do stuff with data (which is already decompressed)
    }
);

然而，我在一个html文档中嵌入了一些js代码，这些代码还需要进行http请求，因此如果没有使用node.js的request模块，我将使用XMLHttpRequest代替：

var request = new XMLHttpRequest();
request.open('GET', 'http://whatever.com/getData', true);
request.onload = function() {
    // do stuff with request.responseText
};
request.send();

尽管我尝试过很多次搜索，但我仍然不知道如何发出一个 XMLHttpRequest 请求并解压缩 gzip 格式的数据。非常感谢您的帮助。

- drmrbrewer

Answer 1

解决方案

我相信我已经找到了如何做到这一点。假设您已经导入了pako JavaScript库（JavaScript链接：此处）进行解压缩。

<script type="text/javascript" src="pako.js"></script>

然后，您可以像这样解压缩数据，例如压缩的JSON格式：

var data;
var request = new XMLHttpRequest();
request.responseType = 'arraybuffer';
request.onload = function() {
  data = JSON.parse(pako.inflate(request.response, { to: 'string' }));
};
request.open('GET',"data.gzip");
request.send();

注意，我使用JSON.parse，因为膨胀的响应是一个字符串，并且保存的数据如 {"chocolate":["dark","white",...]} 被反斜杠保存，例如 {\"chocolate\": ...}。可以使用解析函数解析JSON对象的字符串。

故障排除：

您的XMLHttpRequest如何解释数据非常奇怪。我最初认为您可以将请求类型设置为 "arraybuffer"，然后使用FileReader解析响应字符串。但实际上，我正在将数组缓冲区转换为Blob，以在FileReader中将其转换回数组缓冲区，这完全是多余的，也很混乱。

- Mr G

Answer 2

这可能与浏览器有关：http://www.w3c-test.org/XMLHttpRequest/response-data-gzip.htm 例如，IE上的此测试失败。您需要使用此库手动解压缩响应，例如：https://github.com/nodeca/pako

- Shanoor