Firebase Storage大文件批量下载失败问题及解决方案

问题 #

当Firebase Storage文件夹中的文件达到一定大小后，无法完成批量下载，请问该如何解决？

相关代码 #

async function downloadFilesAsZip(folderPath, zipFilename) {
    console.log('Button clicked');
    document.getElementById('status').innerText = "please wait...";

    const storageRef = storage.ref().child(folderPath);

    try {
        // List all files in the folder
        const fileRefs = await storageRef.listAll();

        // Create a new instance of JSZip
        const zip = new JSZip();

        // Add each file to the zip
        await Promise.all(fileRefs.items.map(async (itemRef) => {
            const downloadURL = await itemRef.getDownloadURL();
            const response = await fetch(downloadURL);
            const fileBlob = await response.blob();
            zip.file(itemRef.name, fileBlob);
        }));

        // Generate the zip file asynchronously
        const zipBlob = await zip.generateAsync({ type: "blob" });

        // Create a download link and trigger download
        const downloadLink = document.createElement('a');
        downloadLink.href = URL.createObjectURL(zipBlob);
        downloadLink.download = zipFilename;
        document.body.appendChild(downloadLink);
        downloadLink.click();
        document.body.removeChild(downloadLink);

        document.getElementById('status').innerText = "download should start..";
    } catch (error) {
        console.error('Error fetching or downloading files:', error);
        document.getElementById('status').innerText = "Error fetching or downloading files. Check console for details.";
    }
}

解决方案 #

将JSZip升级至最新版本即可解决该问题，升级后下载速度会大幅提升，能够顺利完成大文件夹的批量下载任务。

内容的提问来源于stack exchange，提问作者ALAEDDIN