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 } = configconst zip = new JSZip();const cache = {};let downloadStatus = falseconst 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 = truereturn {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();
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/632818.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

文心一言使用分享

ChatGPT 和文心一言哪个更好用? 一个直接可以用,一个还需要借助一些工具,还有可能账号会消失…… 没有可比性。 通用大模型用于特定功能的时候需要一些引导技巧。 import math import time def calculate_coordinate(c, d, e, f, g, h,…

springcloud +Vue 前后端分离的onlinejudge在线评测系统

功能描述: 本系统的研究内容主要是设计并实现一个一个在线测评系统(OJ),该系统集成了博客、竞赛、刷题、教学,公告,个人管理六大功能,用户注册后登录系统,可以浏览本站的全部文章、发…

linux上面hadoop配置集群

要在Linux上配置Hadoop集群,需要按照以下步骤进行操作: 安装Java Development Kit (JDK):首先,确保您的Linux系统上已经安装了JDK。可以通过运行以下命令来检查是否已经安装了JDK: java -version如果返回了Java的版本信…

【JVM】并发的可达性分析详细解释

​ 🍎个人博客:个人主页 🏆个人专栏:JVM ⛳️ 功不唐捐,玉汝于成 ​ 目录 前言 正文 可达性分析的基本原理: 根集合(Root Set): 对象引用关系: 标记…

PyCharm 快捷键(Ctrl + R)正则表达式批量替换

目录 一、使用快捷键CtrlR,打开替换界面 二、输入替换格式 三、点击全部替换 一、使用快捷键CtrlR,打开替换界面 二、输入替换格式 在第一个框输入 (.*): (.*) 第二个框输入 $1:$2, 三、点击全部替换

spring boot学习第八篇:kafka监听消费

为了实现监听器功能 pom.xml文件内容如下&#xff1a; <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLoc…

论文阅读:Vary论文阅读笔记

目录 引言整体结构图数据集构造Vary-tiny部分Document Data数据构造Chart Data构造Negative natural image选取 Vary-base部分 引言 论文&#xff1a;Vary: Scaling up the Vision Vocabulary for Large Vision-Language Models Paper | Github | Demo 许久不精读论文了&#x…

Spring Boot 优雅实现统一数据返回格式+统一异常处理+统一日志处理

在我们的项目开发中&#xff0c;我们都会对数据返回格式进行统一的处理&#xff0c;这样可以方便前端人员取数据&#xff0c;当然除了正常流程的数据返回格式需要统一以外&#xff0c;我们也需要对异常的情况进行统一的处理&#xff0c;以及项目必备的日志。 1. 统一返回格式 …

linux 安装ffmpeg

一、下载 ffmpeg-4.3.1 下载地址&#xff1a;链接&#xff1a;https://pan.baidu.com/s/1xbkpHDfIWSCbHFGJJHSQcA 提取码&#xff1a;3eil 二、上传到服务器root目录下 三、给ffmpeg-4.3.1 读写权限 chmod -R 777 /root/ffmpeg-4.3.1 四、创建软连接 1.进入/bin 目录 2.…

用js做个转盘

样式 <style>.wheel {position: relative;width: 400px;height: 400px;border: 1px solid black;border-radius: 50%;overflow: hidden;margin: auto;}.slice {position: absolute;left: 0;top: 0;width: 0;height: 0;border: 200px solid red;/* border-width: 100px 10…

Spring Boot整合Druid(druid 和 druid-spring-boot-starter)

引言 在现代的Web应用开发中&#xff0c;高性能的数据库连接池是确保应用稳定性和响应性的关键因素之一。Druid是一个开源的高性能数据库连接池&#xff0c;具有强大的监控和统计功能&#xff0c;能够在Spring Boot应用中提供出色的数据库连接管理。本文将研究在Spring Boot中…

Macos flatter(用于快速LLL)本地编译安装(解决安装过程各种疑难杂症)

flatter是一个开源项目&#xff0c;能大大提高LLL的速度&#xff0c;项目提供的安装文档适用于Ubuntu&#xff0c;但是在macos上安装&#xff0c;总会遇到各种各样的问题&#xff0c;这里记录下所踩坑&#xff0c;帮助大家快速在macos上安装flatter。 文章目录 1.安装依赖库&am…

二级C语言备考10

一、单选 共40题 &#xff08;共计40分&#xff09; 第1题 &#xff08;1.0分&#xff09; 题号:6104 难度:易 第1章 以下叙述正确的是 A:有些算法不能用三种基本结构来表达 B:C语言程序不编译也能直接运行 C:结构化程序的三种基本结构是循环结构、选…

离线安装python2的MySQLdb

离线安装python2的MySQLdb 需求 环境&#xff1a; centos7.9 pytthon2.7.5 安装MySQLdb模块 下载MySQLdb模块地址 直接安装报错如下 [rootlocalhost MySQL-python-1.2.5]# ls doc HISTORY MANIFEST.in _mysql.c _mysql_exceptions.py PKG-INFO README.m…

Python使用HTTP代理进行网络测试和监控

在Python中&#xff0c;HTTP代理不仅可以用于网络爬虫&#xff0c;还可以用于网络测试和监控。通过使用HTTP代理&#xff0c;我们可以模拟不同的网络环境&#xff0c;测试应用程序在不同情况下的性能和稳定性。此外&#xff0c;我们还可以使用HTTP代理来监控网络流量和性能指标…

C语言编译和链接

翻译环境和运行环境 在ANSI C的任何一种实现中&#xff0c;存在两个不同的环境 .第一种是翻译环境&#xff0c;在这个环境中源代码被转换为可执行的机器指令 .第二种是执行环境&#xff0c;它用于实际执行代码 翻译环境 翻译环境是由编译和链接两个大过程组成&#xff0c;而…

Baumer工业相机堡盟工业相机如何通过NEOAPI SDK实现相机图像转换为Bitmap图像功能(C#)

Baumer工业相机堡盟工业相机如何通过NEOAPI SDK实现相机图像转换为Bitmap图像功能&#xff08;C#&#xff09; Baumer工业相机Baumer工业相机NEOAPI SDK实现Bitmap的图像转换功能技术背景Baumer工业相机通过NEOAPI SDK实现Bitmap的图像转换功能1.引用合适的类文件2.通过NEOAPI …

npm run dev 启动vue的时候指定端口

使用的是 Vue CLI 来创建和管理 Vue 项目&#xff0c; 可以通过设置 --port 参数来指定启动的端口号。以下是具体的步骤&#xff1a; 打开命令行终端 进入您的 Vue 项目目录 运行以下命令&#xff0c;通过 --port 参数指定端口号&#xff08;例如&#xff0c;这里设置端口号…

mybatisPlus注解将List集合插入到数据库

1.maven引入依赖&#xff08;特别注意版本&#xff0c;3.1以下不支持&#xff09; <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.4.3.1</version></dependency&g…

自建服务器如何备案?

随着互联网的普及和发展&#xff0c;越来越多的人开始考虑自建服务器。然而&#xff0c;在中国大陆地区&#xff0c;自建服务器需要进行备案。本文将介绍自建服务器备案的流程、所需材料以及注意事项。 一、备案流程 确定备案地区 根据《中华人民共和国计算机信息网络国际联网…