我正在寻找关于如何将多个文件(当前在客户端作为base64字符串)保存为Angular 2中的zip目录的方向。
我目前从webapi获取文件作为base64字符串。我将字符串转换为byte []以便使用pdf-viewer进行查看。我还允许用户使用file-saver保存/打印pdf。
现在,我想允许用户将所有选定的文件下载到zip文件夹中。不幸的是,我并不完全了解blob等,因此需要一些帮助才能解决这个问题。请记住,从webapi返回的对象包含每个文件的base64字符串,但可以很容易地转换为byte []和blob。
答案 0 :(得分:0)
对于那些可能发现自己处于这个位置的人,我提出的解决方案利用了我现有的代码,只需要添加JSZip。代码:
public downloadAllFiles() {
console.log("Downloading All Files");
var fileName = this.defaultDataService.defaultDataBase + "-" + this.selectedYear.path + ".zip";
var zip = new JSZip();
var year = zip.folder(this.selectedYear.path);
for (var i = 0; i < this.selectedTypes.length; i++) {
var subDir = year.folder(this.selectedTypes[i].path);
for (var j = 0; j < this.selectedTypes[i].pdfList.length; j++) {
subDir.file(this.selectedTypes[i].pdfList[j].name + ".pdf", this.createPdfBlob(this.convertBase64ToBytes(this.selectedTypes[i].pdfList[j].bytes)));
}
}
zip.generateAsync({ type: "blob" })
.then(function (blob) {
FileSaver.saveAs(blob, fileName);
});
}
convertBase64ToBytes(data: string) {
let byteCharacters = atob(data);
let byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
let byteArray = new Uint8Array(byteNumbers);
return byteArray;
}
createPdfBlob(src: any) {
const byteArrays = [];
byteArrays.push(src);
return new Blob(byteArrays, { type: 'application/pdf' });
}