Javascript 如何使用axios作为流下载大文件,并在reactjs中作为zip下载

Javascript 如何使用axios作为流下载大文件,并在reactjs中作为zip下载,javascript,reactjs,html,file,local-storage,Javascript,Reactjs,Html,File,Local Storage,我正在构建一个前端应用程序,以便从远程对象存储服务器(如S3)下载文件。由于我的应用程序中没有服务器代码,因此文件的下载和压缩是在浏览器本身中完成的 现在,代码可以很好地下载小文件,但在处理大文件时会使浏览器崩溃 我在React js中使用Axios和JsZip实用程序来构建应用程序。 我可以使用tar来避免使用浏览器内存吗?或者,有没有办法将文件流直接存储在计算机的本地存储器中,而不是保存在浏览器的内存中,直到下载了全部文件 以下是我当前实施的代码: import axios from 'ax

我正在构建一个前端应用程序,以便从远程对象存储服务器(如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`);
      })
    }
  })


}