最近在開發(fā)一個大文件壓縮下載需求，由于附件都是從阿里oss上下載，且一次下載多個文件，然后進行打包壓縮，前期使用了axios+jszip+file-saver 來進行處理，但是當文件超過3個G的時候會出現(xiàn)out of memory和RangeError: Array buffer allocation failed錯誤。
下面貼出代碼：
?
?后面嘗試使用streamsaver+fetch下載大文件
- 使用常用的 axios 進行下載時，會遇到以下一些問題：
- 超時問題：如果下載的文件較大或網(wǎng)絡連接較慢，可能會導致請求超時。
- 內存問題：如果下載的文件非常大，將整個文件存儲在內存中可能會導致內存溢出，下載的文件會出現(xiàn)截斷或損壞。
- 進度跟蹤問題：axios 默認不提供下載進度的功能。需要使用 axios-progress-bar 等第三方庫來實現(xiàn)下載進度的監(jiān)控和顯示。
- 下載文件時，需要等待整個文件流都下載到內存中才會彈出瀏覽器的下載文件保存對話框，用戶體驗較差。
- 使用Fetch下載相比Axios在文件下載方面的一些優(yōu)勢：
- 原生支持：Fetch是瀏覽器原生提供的API，不需要額外的第三方庫或依賴。這意味著在現(xiàn)代瀏覽器中，無需額外配置即可直接使用Fetch進行文件下載。
- 內置的流支持：Fetch使用ReadableStream對象處理響應數(shù)據(jù)，這使得在下載大文件時能夠有效地處理數(shù)據(jù)流，減少內存占用。相比之下，Axios默認將整個響應加載到內存中，對于大文件下載可能會導致內存問題。
- 下載響應開始就可以彈出瀏覽器下載保存對話框，并且不影響文件流下載，而axios需要等待整個文件流都下載到內存中才會彈出瀏覽器的下載文件保存對話框
- StreamSaver：StreamSaver.js 是一個用于在瀏覽器中實現(xiàn)流式文件下載的 JavaScript 插件。它提供了一種簡單而強大的方式來下載大文件或流式數(shù)據(jù)，而無需將整個文件加載到內存中。
- 逐步下載：StreamSaver.js 通過逐步寫入磁盤，實現(xiàn)了流式下載，避免了將整個文件加載到內存中
- 跨瀏覽器兼容性：StreamSaver.js 支持主流的現(xiàn)代瀏覽器，包括 Chrome、Firefox、Edge 和 Safari。
- 斷點續(xù)傳：通過在下載過程中保存已下載的部分，StreamSaver.js 支持斷點續(xù)傳，即使在網(wǎng)絡中斷或下載過程中停止，也可以從上次中斷的地方恢復下載。
文章來源：http://www.zghlxwxcb.cn/news/detail-673063.html
?文章來源地址http://www.zghlxwxcb.cn/news/detail-673063.html
到了這里，關于vue前端下載阿里oss超大文件的問題的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！
