视频及JSON数据的导出并压缩

embedded/2024/12/21 17:40:43/

npm下载安装 jszip 和 file-saver 这两个库来实现文件的压缩和保存功能:

npm install jszip 
npm install file-saver

导入依赖库:

import JSZip from 'jszip';
import { saveAs } from 'file-saver';

方法实现:

batchDownload() {const zip = new JSZip();// 下载后压缩包的名称const blogTitle = '检测数据.zip';const cache = {};const promises = [];// this.tableData  为数据体数据this.tableData.forEach(item => {// URL 构建修正let url = "https://plat.aiplusfirst.com" + (item.wuImg ? item.wuImg : item.img);// 文件名构建const folderName = item.id + "-" + item.quadrant + '-' + item.leftRightBreasts + '-' +this.classifyToNumber(item.aiResult) + '-' + this.classifyToNumber(item.allResult) +'-' + item.contFlag + '-' + item.deviceNum;const video_name = folderName + '/' + item.id + '.' + item.imgType;const json_name = folderName + '/' + item.id + '.json';// 获取并存储视频文件const videoPromise = this.getFile(url).then(data => {zip.file(video_name, data, { binary: true }); // 添加视频文件到zipcache[video_name] = data;});// 处理JSON数据const jsonData = JSON.stringify(item.jsonData);const jsonBlob = new Blob([jsonData], {type: 'application/json'});const jsonPromise = new Promise(resolve => {zip.file(json_name, jsonBlob); // 添加JSON文件到zipresolve(); // 没有异步操作,所以直接resolve});// 将两个Promise都推入数组promises.push(videoPromise, jsonPromise);});// 等待所有Promise完成Promise.all(promises).then(() => {zip.generateAsync({type: "blob",compression: 'DEFLATE',compressionOptions: {level: 9 // 压缩等级}}).then(content => {saveAs(content, blogTitle); // 保存压缩包});}).catch(error => {console.error('批量下载失败:', error);});
},getFile(url) {return new Promise((resolve, reject) => {let xmlHttp = new XMLHttpRequest();xmlHttp.open("GET", url, true);xmlHttp.responseType = "blob";xmlHttp.onload = function () {if (xmlHttp.status === 200) {resolve(xmlHttp.response);} else {reject(xmlHttp.statusText || xmlHttp.responseText);}};xmlHttp.onerror = function () {reject(xmlHttp.statusText || xmlHttp.responseText);};xmlHttp.send();});
},


http://www.ppmy.cn/embedded/147584.html

相关文章

硬件之DCDC开关电源

一、BUCK降压原理(重点) 1、这里其实就是开关S不停的通断,形成PWM波 2、L电感,电容C和续流二极管之间形成回路,这样就可以输出想要的电压了 假设PWM的电压为15V,经过续流回路之后就会输出5V 二、选型 1、…

HTML5技术深度解析与实战应用

引言 HTML5作为新一代的HTML标准,带来了许多新特性和改进,这些变化不仅提升了网页的表现力,也为开发者提供了更多的工具和API来构建丰富、互动的网络应用。本文将深入解析HTML5的关键特性,并提供实战应用示例,帮助开发…

Node的学习以及学习通过Node书写接口并简单操作数据库

Node的学习 Node的基础上述是关于Node的一些基础,总结的还行; 利用Node书写接口并操作数据库 1. 初始化项目 创建新的项目文件夹,并初始化 package.json mkdir my-backend cd my-backend npm init -y2. 安装必要的依赖 安装Express.js&…

使用 esrally race 测试 Elasticsearch 性能:实践指南

在 Elasticsearch 性能优化和容量规划中,使用 esrally 进行基准测试是官方推荐的方式。通过 esrally race 命令,您可以针对不同的数据集与挑战类型,对 Elasticsearch 集群进行精确的性能评估。本文将简要介绍常用的数据集与挑战类型&#xff…

【mac 终端美化】oh my zsh

快捷的mac终端美化方法。 以下是效果图,比较朴素,但是相比默认方案会好看一些,也能明显查看输入的命令,不会和输出混在一起。 下载主题 访问网址:https://iterm2colorschemes.com/,下载网页的压缩包并解…

Python从0到100(七十八):神经网络--从0开始搭建全连接网络和CNN网络

前言: 零基础学Python:Python从0到100最新最全教程。 想做这件事情很久了,这次我更新了自己所写过的所有博客,汇集成了Python从0到100,共一百节课,帮助大家一个月时间里从零基础到学习Python基础语法、Pyth…

软件项目开发中,需求分析所占比例一般是多少?

在软件项目开发中,需求分析阶段通常占整个项目开发周期的较大比例。具体比例可能会因项目的复杂性、规模、行业和开发方法(如瀑布模型、敏捷开发等)而有所不同。一般来说,需求分析的时间和资源投入占比大致在 10% 到 20% 之间&…

谷歌浏览器的多语言支持与设置教程

在当今全球化的时代,拥有一款能够提供多语言支持的浏览器变得尤为重要。谷歌浏览器作为全球最受欢迎的浏览器之一,其强大的多语言支持和简便的设置方法,为用户提供了极大的便利。本文将详细介绍如何在谷歌浏览器中进行语言设置、消息推送以及…