将 zip 流式传输到浏览器不起作用，但在 Postman 中有效答案

【问题标题】：Streaming zip to browser doesn't work, but works in Postman将 zip 流式传输到浏览器不起作用，但在 Postman 中有效
【发布时间】：2022-01-31 17:11:04
【问题描述】：

我正在使用以下package 直接在浏览器中下载 ZIP 文件。为此，我在前端使用以下代码：

      await this.$axios
        .get(
          `/inspections/defects/download/${this.$route.params.uuid}`, {
              responseType: 'arraybuffer' // This is the problem
          }
        )
        .then((response) => {
          const url = window.URL.createObjectURL(
            new Blob([response.data], { type: 'application/octet-stream' })
          );
          const link = document.createElement('a');
          link.href = url;
          link.setAttribute('download', 'file.zip');
          document.body.appendChild(link);
          link.click();
        });

我只是直接从后端使用

app.get('/download/:uuid', (req, res) => {
  // get filename from db, but it's 99,9% the same as the example provided in the readme of the npm package.

  s3Zip
    .archive({ region: region, bucket: bucket }, '', 'abc.jpg')
    .pipe(res)
})

当我尝试通过邮递员“发送和下载”时，它运行良好，它下载了一个包含大约 5MB 图像的 zip，这是正确的。

现在当我尝试通过 axios 代码下载它时，我得到了任何一个

或者

经过一些研究，我总是得出相同的解决方案，那就是设置 responseType，它似乎对每个人都有效。但是，如果我尝试这样做，我会收到以下控制台错误，并且在搜索时找不到任何相关问题：

我也尝试过不同的内容类型，但似乎无法理解。尤其是因为它可以在 Postman 中使用。

相关问题，但已通过使用 arraybuffer 修复： https://github.com/orangewise/s3-zip/issues/45

【问题讨论】：

标签： express axios stream

【解决方案1】：

根据https://stackoverflow.com/a/58696592 axios 目前不支持文件流。我使用了原生 fetch，现在它可以正常工作了。

关于如何使用 axios 执行此操作的数十个示例非常具有误导性。

【讨论】：