如何在所有浏览器上下载ZIP文件

时间:2016-10-06 15:14:50

标签: javascript angularjs node.js express

这就是我目前所拥有的:

express.js

app.get('/downloadZip', function(req, res) {
  var file = req.query.downloadURL;
  var filename = path.basename(file);
  var mimetype = 'application/zip';

  res.setHeader('Content-disposition', 'attachment');
  res.setHeader('Content-type', mimetype);

  var filestream = fs.createReadStream(file);
  filestream.pipe(res);
});

我的控制器

$http({
  method: "GET",
  url: '/downloadZip',
  params: {
    downloadURL: 'myZip.zip'
  },
  responseType: 'arraybuffer'
}).then(
  function success(data, status, headers, config) {
    $log.debug('downloadZip success: ', data);

    var blob = new Blob([data], {type: 'application/octet-stream'});
    // using FileSaver.js
    saveAs(blob, 'newZipName.zip');
  },
  function error(error) {
    $log.debug('downloadZip error: ', error);
  });

使用这种方法,似乎找到文件正常 - $log.debug输出显示data的5Mb ArrayBuffer,这是正确的文件大小。但是,文件总是下载为1Kb,显然不会打开。

我正在尝试上面的示例中的FileSaver.js,但我也尝试使用angular.element('<a/>')等 - 它总是会导致1Kb的下载。

我有什么办法可以正确下载完整的ZIP吗?

修改

我明白了 - 请参阅下面的答案。其中一个愚蠢的错误。但至少对于想要下载ZIP的人来说,上面有一些不错的免费代码;)

1 个答案:

答案 0 :(得分:1)

我需要的只是data.data

因为这是收到的data对象的内容:

Object {data: ArrayBuffer, status: 200, config: Object, statusText: "OK"}

所以我必须指定包含ArrayBuffer的子data ...

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