前端批量下载文件

枕着光的她

已于 2024-03-14 10:37:54 修改

阅读量451

点赞数 7

文章标签： javascript 前端开发语言

于 2024-02-05 16:42:52 首次发布

本文链接：https://blog.csdn.net/m0_69838795/article/details/136044306

版权

本文介绍了一个使用JavaScript的async函数实现的批量下载功能，通过FetchAPI获取OSS文件内容，创建Blob对象并生成下载链接，实现从给定文件地址数组中下载文件。

摘要由CSDN通过智能技术生成

arr:由文件地址组成的数组

export async function BatchDownload(arr: any) {
    // 模拟从OSS获取的文件链接
    for (const url of arr) {
        // 使用Fetch API获取文件内容
        const response: any = await fetch(url);
        const fileData: any = await response.blob();

        // 创建Blob对象
        const blob = new Blob([fileData], { type: response.headers.get("content-type") });

        // 创建URL
        const fileUrl = URL.createObjectURL(blob);

        // 创建a标签
        const link = document.createElement("a");

        // 设置a标签的属性
        link.href = fileUrl;
        link.download = url.substring(url.lastIndexOf('/') + 1); // 使用文件名作为下载文件名

        // 将a标签添加到DOM中
        document.body.appendChild(link);

        // 触发下载
        link.click();

        // 移除a标签
        document.body.removeChild(link);

        // 释放Blob对象的URL
        URL.revokeObjectURL(fileUrl);
    }
}