我在使用 Typescript 的 Angular2 v4 应用程序中工作，我需要一种方法来将许多图像(base64 格式)下载到 Zip 文件中。
例如: 我有一个这样的数组(例如假的 base64 图像)
data = [
'data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA ...',
'data:image/png;base64, iVBTYu0KGgoBBBBNSUhYUgJJJJUA ...',
'data:image/png;base64, CGBHHFGY0goAAAANSUhEUgAAAAUA ...',
...
]
我需要一种方法来下载它，首先将每个图像转换为 .jpg 或 .png 图像，然后编译所有图像并下载为 zip 文件。像这样(我不知道代码，我只需要这样的东西)
downloadZip() {
const arrayAsJPG = [];
this.data.forEach(i => {
const imageInJpg = i.convertToJPGfile(); // this is not code, this is a function that converts the base64 to a jpg file
arrayAsJPG.push(imageInJpg);
});
ZipFileSaver.save(arrayAsJPG, 'myImageReport.zip'); // this isn't code neither, just and interpretation of what I need
}
有什么办法可以做到吗？
最佳答案
@gary 给出了很好的解释。 我在 stackoverflow 上找到了几个例子:
Is it possible to generate zip file and download in Angular 4?
Converting base64 to blob in javascript
也可以使用@types/jszip。
我构建了一个执行以下操作的示例:
- 它从 API(模拟)中获取您描述的数组；
- 将该数组的每一项转换为一个 blob；
- 它将 blob 作为文件添加到 zip 文件中；
- 最后创建 zip 文件；
- 我只有 png base64，所以将其更改为 jpg。
https://stackblitz.com/edit/angular-jzqtrk?file=src%2Fapp%2Fapp.component.ts
关于Angular 4 下载 base64 图像数组作为 ZIP 文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57382138/