vue中合并下载打包视频图片

    async is_downFile(list) {
      if (list.length > 0) {
        const config = {
          downloadList: list,
          suffix: "打包后文件名称.zip",
        };
         // downloadStatus 成功后状态可自行加业务
        const { downloadStatus } = await attachDownload(config);
        return { downloadStatus };
      }
    }
// fileDownload.js
// 相关依赖
// yarn add jszip
// yarn add file-saver
import JSZip from "jszip";
import FileSaver from "file-saver";
export async function attachDownload(config) {
    const { downloadList, suffix } = config
    const zip = new JSZip();
    const cache = {};
    let downloadStatus = false
    const downloadPromises = downloadList.map(async (item) => {
        try {
            if (item.url) {
                //${item.Title}_${item.FileID} 打包后视频或者图片对应名称
                // item.type 对应后缀名称
                const data = await getImgArrayBuffer(item.url);
                zip.folder(suffix).file(`${item.Title}_${item.FileID}` + item.type, data, { binary: true });
                cache[item.id] = data;
            } else {
                throw new Error(`文件${item.fileName}地址错误,下载失败`);
            }
        } catch (error) {
            console.error("文件获取失败", error);
        }
    });
    try {
        await Promise.all(downloadPromises);
        const content = await zip.generateAsync({ type: "blob" });
        FileSaver.saveAs(content, suffix);
        downloadStatus = true
        return {
            downloadStatus
        }
    } catch (error) {
        console.error("文件压缩失败", error);
    }
}
async function getImgArrayBuffer(url) {
    const response = await fetch(url);
    if (!response.ok) {
        throw new Error(`请求失败: ${response.status}`);
    }
    return await response.blob();
}

你可能感兴趣的:(vue.js,javascript,前端)