如何在Reactjs中使用axios作为流下载大文件并以zip下载

Question

我正在构建一个前端应用程序，以从S3之类的远程对象存储服务器下载文件。由于我的应用程序中没有服务器代码，因此文件的下载和压缩是在浏览器本身中完成的。

现在，该代码可以很好地下载小型文件，但在处理较大文件时会导致浏览器崩溃。

我在React js中使用Axios和JsZip实用程序来构建应用程序。 我可以使用tar避免使用浏览器内存吗？还是有一种方法可以将文件流直接存储在计算机的本地存储中，而不是保存在浏览器的内存中，直到下载完整个文件为止。

下面是我当前实现的代码：

import axios from 'axios'
import JSZip from 'jszip'
import saveAs from 'file-saver'

const downloadObjectAsZip = (dispatch, urlArray) => {
  let zip = new JSZip()
  let count = 0
  const CancelToken = axios.CancelToken
  source = CancelToken.source()
  urlArray.forEach((result) => {
  axios({
    url: result.url,
    method: 'GET',
    responseType: 'blob',
    cancelToken: source.token,
    onDownloadProgress: function(progressEvent) {
        // Update progress in progress bar
    }
    }).then((response) => {
        count++
    if (response.data.size) {
        const fileName = result.name
        zip.file(fileName, response.data, { binary: true })

    }

    }).catch((thrown) => {
            if (axios.isCancel(thrown)) {
        console.log('request cancel by user')
    } else {
        console.error('axios error', thrown.message);
    }
    })

    if(urlArray.length == count){
      zip.generateAsync({ type: "blob" }).then(function(content) {
        saveAs(content, `archive.zip`);
      })
    }
  })


}