AJAX响应返回了一个损坏的压缩文件（.tgz）。

Question

我们正在实现一个客户端Web应用程序，与服务器之间仅通过XMLHttpRequests（和AJAX引擎）进行通信。

XHR响应通常是一些带有XML的纯文本，但在这种情况下，服务器以.tgz文件类型发送压缩数据。我们确定服务器发送的数据是正确的，因为如果我们使用像curl这样的HTTP命令行客户端，作为响应发送的文件是有效的并且包含预期的数据。

然而，在进行AJAX调用并将响应“blobing”为可下载文件时，我们获取的文件大小不同（较大），而且不被解压器识别。显示以下错误：

gzip: stdin: not in gzip format
/bin/gtar: Child returned status 1
/bin/gtar: Error is not recoverable: exiting now

我使用的代码如下:

*$.AJAX*.done(function(data){
    window.URL = window.webkitURL || window.URL;
    var contentType = 'application/x-compressed-tar';
    var file = new Blob([data], {type: contentType});
    var a = document.createElement('a'),
    ev = document.createEvent("MouseEvents");
    a.download = "browser_download2.tgz";
    a.href = window.URL.createObjectURL(file);
    ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0,
            false, false, false, false, 0, null);
    a.dispatchEvent(ev);
});

我避免使用用于发起AJAX请求的参数，但我们假设这不是问题，因为我正确地收到了响应。我使用这个contentType，因为它与通过curl获取的相同，但我尝试了不同的contentType。代码可能看起来有点奇怪，所以我会为您分解一下：我基本上正在创建一个链接，并将下载链接和文件名称附加到链接上（这是一个古怪的方法来命名文件）。最后，我虚拟点击链接。

我使用十六进制查看器比较了正确的tgz文件和通过浏览器获得的文件，并观察到在损坏的文件中重复出现的模式（EF、BF和BD，沿着整个文件），而这些模式在正确的文件中不存在。

因此，我考虑了一些可能的原因：

(a) 浏览器正在添加额外的字符，或者响应头仍然在下载的文件中。

(b) 文件已经部分解压缩了，因为当我检查请求头时，我可以说明“Accept-Encoding: gzip, deflate”，尽管我不知道浏览器（在我的情况下为Firefox）是否自动解压缩数据。

(c) 我使用的代码来生成blob数据不正确；虽然在另一个场合中，它成功地完成了一个纯文本文件的任务。

编辑

我还向您提供十六进制检查的链接：

(a) 损坏的文件：http://en.webhex.net/view/278aac05820c34dfbdd2217c03970dd9/0 (b) （可能）正确的文件：http://en.webhex.net/view/4a01894b814c17d2ec71ba49ac48e683

- user3049130

Answer 1

我不知道这篇文章是否对某些人有帮助，但以防万一，我找到了我的问题的原因和可能的解决方案。

原因

默认的JavaScript变量以Unicode/ASCII格式存储信息；它们没有准备好正确存储二进制数据，这就是为什么人们可以轻松地看到错误字符的解释（这也解释了为什么在Hex查看器中观察到EF、BF等的重复，这代表ASCII/Unicode的错误字符）。

解决方案

最新的浏览器版本实现了所谓的"typed arrays"。它们是JavaScript数组，可以以不同的格式（包括二进制）存储数据。然后，如果指定XMLHttpRequest响应是以二进制格式进行的，则数据将被正确存储，并且当转化成文件时，该文件将不会损坏。请查看我使用的代码：

var xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.responseType = 'arraybuffer';

注意关键点是将responseType定义为"arraybuffer"。有趣的是，我决定不再使用Jquery进行AJAX操作。它很差地实现了这个功能，并且我尝试解析Jquery的所有尝试都失败了（覆盖MimeType在其他地方描述的也没有在我的情况下起作用）。相反，旧的普通XMLHttpRequest工作得非常好。

- user3049130

---

2015年仍然有用！ - rdnewman

我可以确认，在2019年使用jQuery 3.3.1仍然是这种情况，并且这个答案仍然有效。 - Philip Rowlands