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