angulaire 2 - Création Zip à partir des tableaux d'octets

Question

Je cherche une direction sur la façon d'aller sur l'enregistrement de plusieurs fichiers (actuellement sur le côté client comme une chaîne base64) en tant que répertoire zip angulaire 2.

Je suis actuellement obtenir les fichiers de mon webapi comme une chaîne base64. Je convertis la chaîne en un octet [] pour l'affichage en utilisant pdf-viewer. Je permet également à l'utilisateur de sauvegarder/imprimer le pdf en utilisant file-saver.

Maintenant, je voudrais permettre à l'utilisateur de télécharger tous les fichiers sélectionnés dans un dossier zip. Malheureusement, je ne comprends pas tout à fait blobs et tels et, par conséquent, besoin d'aide sur la façon d'aborder cela. Gardez à l'esprit que l'objet retourné par le webapi contient des chaînes base64 pour chaque fichier, mais peut facilement être converti en byte [] et blob.

Answer 1

Pour ceux qui peuvent se trouver dans cette position, la solution que j'ai trouvée a utilisé mon code existant et seulement besoin d'ajouter JSZip. Le code pour ceci:

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' }); 
}