Question

我正在尝试下载一个zip文件，它在AJAX请求的响应中以二进制形式返回。

我尝试了以下代码，但无法下载，即使我下载了该文件也已损坏。我检查了响应是否正确并转到开发人员工具中的网络选项卡并将响应保存为zip文件并打开它，并且它已成功打开。希望有人可以告诉我我做错了什么。

  var URL = window.URL;

  var downloadData = new Blob([data._body], { type: 'application/octet-stream' });

  var downloadURL = URL.createObjectURL(downloadData);

  window.open(downloadURL);

浏览器打开一个新窗口并告诉我IE和＆amp;在Chrome中下载损坏的文件。浏览器中的URL类似于

blob:http://localhost:4200/62b8283c-1391-4133-98a4-ed3cc9aa1f73

-

      var downloadData = new Blob([data._body], { type: 'application/zip' });

  FileSaver.saveAs(downloadData,"hi.zip");

上面的代码没有给出任何特定的错误，但是当文件保存时它已经损坏了。我也尝试使用类型为application/octet-stream的上述代码，但结果相同。

事情是二进制数据似乎非常好，我唯一需要做的就是打开一个保存对话框，它将保存二进制数据。似乎是一个非常简单的用例，但在Js / TS方面的zip情况下似乎有点令人困惑。我认为主要的问题是我正在创建一个包含二进制数据的blob（我认为我不需要或者应该转换为blob）但是我无法在不创建blob对象的情况下触发下载API似乎只接受blob（如URL Object或FileSaver API）。

Answer 1

我遇到了完全相同的问题，当我试图打开它时，zip文件已损坏。我通过添加：responseType = ResponseContentType.ArrayBuffer

来修复它

这是我的代码：

public httpRequest(call) {
call.headers = new Headers({
  'Authorization': 'Bearer ' + localStorage.getItem('id_token'),
  'Content-Type': 'application/json',
  'Accept': 'application/octet-stream'
});

let req = new Request(call);
req.responseType = ResponseContentType.ArrayBuffer;

return this.http.request(req).map((res: Response) => {
  return res;
});

}

确保导入：

import { Http, Headers, Request, Response, BaseResponseOptions, ResponseContentType } from '@angular/http';

从Angular 2 / TypeScript中的AJAX响应中保存ZIP文件

1 个答案: